vue 文件上传代码片段

以下是一个 Vue 文件上传的代码片段：

<template>
  <div>
    <form>
      <input type="file" ref="fileInput" @change="uploadFile"/>
    </form>
  </div>
</template>

<script>
export default {
  methods: {
    async uploadFile() {
      const input = this.$refs.fileInput
      const file = input.files[0]
      const formData = new FormData()
      formData.append('file', file)
      try {
        const response = await axios.post('/server/upload', formData)
        console.log(response.data)
      } catch (err) {
        console.error(err)
      }
    }
  }
}
</script>

在这个代码片段中，通过一个表单和 `input` 元素实现了文件上传的功能。当用户选择了文件并点击了“上传”按钮后，会触发 `change` 事件，进而执行 `uploadFile` 方法。

在 `uploadFile` 方法中，通过 `FormData` 对象将文件存储到一个表单数据对象中，并使用 `axios` 库发送一个 `POST` 请求到服务器上传文件。最后，在请求的回调中，打印出响应的数据。