从React上传文件到Laravel时出现问题

时间:2019-07-19 14:15:34

标签: javascript reactjs laravel laravel-5

我正在尝试将一个文件从reactjs项目上传到Laravel后端。

在react中,我将其设置如下(组件来自reactstrap):

<FormGroup>
  <Label for="invoice">
    <IntlMessages id="words.invoice" />
  </Label>
  <Input
    type="file"
    name="invoice"
    onChange={this.handleInvoiceChange}
  />
</FormGroup>;

并在handleInvoiceChange中将文件设置为状态

handleInvoiceChange = e => {
  this.setState({
    formData: {
      ...this.state.formData,
      invoice: e.target.files[0]
    }
  });
};

并将表单发送到服务器

submitForm = () => {
  const formData = { ...this.state.formData };
  console.log("send data", formData);
  axios.post(`items/edit/${this.itemId}`, formData).then(response => {
    console.log(response);
  });
};

将表单发送到服务器时,我在控制台中检查数据: enter image description here

在laravel中,我尝试使用

转储文件
$invoice = $request->file('invoice');

dd($invoice);

但这总是空的。 我在这里想念什么?

1 个答案:

答案 0 :(得分:0)

我猜这是因为代码中的FormData并不是真正的FormData,而只是JSON数据。

我将初始化一个FormData对象并附加数据。

submitForm = () => {
  const formData = new FormData();
  formData.append('invoice', this.state.formData.invoice);
  ...  //  append more data

  axios.post(`items/edit/${this.itemId}`, formData).then(response => {
    console.log(response);
  });
};

如果不是这个原因,请检查$request中的整个laravel数据以查看 它真正收到了什么。