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

Question

我正在尝试将一个文件从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);
  });
};

将表单发送到服务器时，我在控制台中检查数据：

在laravel中，我尝试使用

转储文件

$invoice = $request->file('invoice');

dd($invoice);

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

Answer 1

我猜这是因为代码中的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数据以查看 它真正收到了什么。