vue3上传excel文件给后端传file

首先在 Vue3 中需要创建一个 input 元素来接收文件上传，代码如下：

<template>
  <div>
    <input type="file" @change="handleFileUpload">
  </div>
</template>

然后在 Vue3 的 methods 中编写 handleFileUpload 方法来获取上传的文件，并将其发送给后端。具体实现方式可以使用 `FormData` 对象进行封装，代码如下：

<script>
import axios from 'axios'

export default {
  methods: {
    async handleFileUpload(event) {
      const file = event.target.files[0]
      const formData = new FormData()
      formData.append('file', file)
      try {
        const response = await axios.post('/api/upload', formData, {
          headers: {
            'Content-Type': 'multipart/form-data'
          }
        })
        console.log(response.data)
      } catch (error) {
        console.error(error)
      }
    }
  }
}
</script>

在上面的代码中，我们使用了 axios 库来发送 POST 请求，其中第二个参数传入了封装好的 formData 对象，并且设置了请求头 `Content-Type: multipart/form-data`。在后端接收到该请求时，通过 `request.files` 来获取上传的文件数据。