vue实现doc上传

lender提了个需求，要求点击上传按钮实现doc上传

html部分

<template>
	<div style="width:80px;line-height:36px;border:solid 1px;" @click="upload">上传表格</div>
	<input ref="file" type="file" style="display:none" accept=".doc, .docx" @change="fileChange">
</template>

js部分

import axios from 'axios'
export default {
  methods: {
    upload() {
      this.$refs.file.click()
    },
    fileChange(e) {
      var form = new FormData()
      var file = e.target.files[0]
      var name = file.name + ''
      // 防止用户手动更改选择类型
      if (name.indexOf('.doc') === -1 && name.indexOf('.docx') === -1) {
        this.$message.warning('请选择正确的文件类型')
        return
      }
      form.append('word', file) // 对应接口的字段名word,根据接口进行修改
      // 调用上传接口
      axios.post('/sites/word/upload', form).then((data) => {
        // this.$refs.file.value = '' 如果希望重复上传文件请取消注释
        alert(`模板上传成功`)
      })
    }
  }
}