vue 如何进行上传文件代码

在 Vue 中上传文件需要借助 HTML5 的 FormData API 和 AJAX 技术。以下是一个简单的上传文件的代码示例：

<template>
  <div>
    <input type="file" @change="handleFileChange">
    <button @click="uploadFile">上传</button>
  </div>
</template>

<script>
export default {
  data() {
    return {
      file: null
    }
  },
  methods: {
    handleFileChange(event) {
      this.file = event.target.files[0]
    },
    uploadFile() {
      let formData = new FormData()
      formData.append('file', this.file)

      // 发送 AJAX 请求
      this.$http.post('/api/upload', formData)
        .then(response => {
          console.log(response)
        })
        .catch(error => {
          console.log(error)
        })
    }
  }
}
</script>

在上面的示例代码中，我们首先在模板中添加了一个文件上传的输入框和一个上传按钮。当用户选择一个文件后，我们使用 `@change` 监听文件变化事件，将选择的文件保存在组件的 `file` 数据中。

当用户点击上传按钮时，我们创建一个 `FormData` 对象，将选中的文件添加到表单数据中，并使用 Vue-resource 的 `$http` 方法发送 AJAX 请求。在服务端，我们可以通过 `request.files['file']` 来获取上传的文件。