首页 > 解决方案 > 上传文件到服务器时不显示结果

问题描述

我需要使用 axios 发送图片,然后将其 url 输出到控制台。后端工作正常,它提供了一个数组并将图片加载到文件夹中。但由于某种原因,我无法通过控制台输出到前面。根本不输出任何东西,虽然后端返回图片加载成功

const uploadImage = file => {
    return new Promise((resolve, reject) => {
        let formData = new FormData()
        formData.append('imagesUp', file)

        const config = {
            headers: {
                'Content-Type': 'multipart/form-data',
                Folder: 'editor',
            },
        }

        axios.post('/api/upload', formData, config).then(responseImage => {
            console.log(responseImage)
            resolve({ data: { link: '//werafgrswe' } })
        })
    })
}
{
  "status": "success",
  "message": "File uploaded successfully",
  "data": [
    {
      "_id": 0,
      "name": "2020result-global-town-1609439624185.jpg",
      "path": "/uploads/editor/2020result-global-town-1609439624185.jpg",
      "size": "1.13 MB"
    }
  ]
}```

标签: javascriptreactjspromiseaxios

解决方案


移除额外的 Promise

const uploadImage = (file) => {
  let formData = new FormData();
  formData.append("imagesUp", file);

  const config = {
    headers: {
      "Content-Type": "multipart/form-data",
      Folder: "editor"
    }
  };

  return axios.post("/api/upload", formData, config).then((responseImage) => {
    return responseImage.data;
  });
};
React.useEffect(() => {
  uploadImage(file).then((data) => {
    console.log(data);
  });
}, [file]);

推荐阅读