通过POST将额外的值传递给另一个函数

时间:2019-03-04 07:27:52

标签: reactjs express

我在通过函数传递groupId到函数中遇到麻烦,基本上我是上传图片,但是我需要在其他函数上传递groupId来重命名图片,使用react和express来做到这一点:

  onFormSubmit = async (event) => {
    event.preventDefault();
    const { imageFile, currentGroupId } = this.state;
    var formData = new FormData();
    formData.append('groupImage', imageFile);
    const config = {
      headers: {
        'content-type': 'multipart/form-data'
      }
    };
    await api.post('/fileUpload/group', { currentGroupId }, formData, config );
  }

我的路线:

router.post('/group', (req, res) => {
  fileuploadmanager.uploadFile(req, res);
});

以及后端:

uploadFile(req, res) {
    const { uploadsPath } = this.porperties;
    const { currentGroupId } = req.body;//it prints but formData and config never comes here
    console.log("GROUP: ", currentGroupId);
    const storage = multer.diskStorage({
      destination: uploadsPath,
      filename: (req, file, cb) => {
        cb(null, `${file.fieldname}-${Date.now()}${path.extname(file.originalname)}`);
      },
    });

    const upload = multer({
      storage,
      limits: {
        fileSize: 1000000,
      },
      fileFilter: (req, file, cb) => {
        this.checkFileType(file, cb);
      },
    }).single('groupImage');

    upload(req, res, (err) => {
      if (err) {
        console.log(err);
      }
    });
  }

仅发送formDataconfig即可,但是如果我向端点添加groupId则不起作用。 我尝试将其值附加到formData中,但是我无法在后端获得它,所以现在我尝试将其作为req.body传递,它可以正常工作,但我的其他参数没有传递到后端。 / p>

如何将我的groupId,formData和config传递给后端?

编辑api是用于指定我的后端URL的包装器。我正在使用axios

import axios from 'axios';

export default axios.create({
  baseURL: process.env.REACT_APP_API_URL  
});

参考文献:

1 个答案:

答案 0 :(得分:0)

尝试将所有数据发送到一个对象await api.post('/fileUpload/group', { currentGroupId, formData, config });中 然后在uploadFile(req, res) { const postData = req.body;中获取数据; 这应该可以解决问题。