Question

我在这里关注Academind关于使用node＆multer上传图像的教程：https://www.youtube.com/watch?v=srPXMt1Q0nY

并且正如预期的那样，他的代码对我来说还不错。但是，当我从Postman切换到我的React代码时，我开始收到一个错误，即图像的req.file.path未定义。我怎样才能将图像正确地发布到我的后端？这是错误的代码：

我们首先输入文件和提交按钮。

            <label htmlFor="profilePic">Profile Picture</label>
        <input type="file" name="profilePic" className="inputfile" onChange={this.newFile}/>

        <section className="submit-form">
          <span onClick={this.submitForm}>
            <p>SUBMIT</p>
          </span>
        </section>

还有其他输入，例如textareas，但它们工作得很好，所以我省略了这些输入。无论如何，我都会捕获输入并将其设置为状态。

      //Set text values to state
  newValue = e => this.setState({ [e.target.name]: e.target.value });

  newFile = e => this.setState({ [e.target.name]: e.target.files[0] });

  submitForm = () => {
    let profileData = {
      username: this.state.username,
      bio: this.state.bio,
      alignment: this.state.alignment,
      location: this.state.location,
      skills: this.state.skills,
      origin: this.state.origin,
      profilePic: this.state.profilePic
    };

    this.props.createProfile(profileData, this.props.history);
  };

创建个人资料是一项使用Redux发布数据的操作。

    // Create Profile
export let createProfile = (profileData, history) => dispatch => {
  axios
    .post("/api/profile", profileData)
    .then(res => history.push("/dashboard"))
    .catch(err => dispatch({ type: GET_ERRORS, payload: err.response.data }));
};

无论如何，你们能告诉我为什么它用Postman上的表单数据发布而不是React吗？

为什么我的图像成功地以Postman表单数据上传，但没有以我的响应代码上传？

0 个答案: