首页 > 解决方案 > 简单的 React 文件上传,不附加表单数据

问题描述

     const [image, setImage] = useState({ preview: "", file: "" });
     const handleChange = (e) => {
        e.preventDefault();
        if (e.target.files.length) {
          setImage({
            preview: URL.createObjectURL(e.target.files[0]),
            file: e.target.files[0],
          });
        }
      };
      useEffect(() => {
        const formData = new FormData();
        formData.append("file", image.file);
        console.log(formData);
      }, [image]);

上面代码中console.log(formData);返回空对象,无法在axios上发送文件

标签: javascriptreactjsajaxreact-hooksuse-effect

解决方案


您无法打印FormData以查看条目。 https://developer.mozilla.org/en-US/docs/Web/API/FormData

您需要使用密钥获取它:formData.get('file')应该为您提供您需要验证的内容。


推荐阅读