后台管理系统 单个上传pdf和word格式文件

<el-form ref="elForm" :model="formData" :rules="rules" size="medium" label-width="100px">
    <el-form-item label="招标文件" prop="field">
        <el-upload
          ref="field"
          :file-list="fieldfileList"
          :action="fieldAction"
          :before-upload="fieldBeforeUpload"
          :http-request="getFile"
          :on-change="handleChange"
          accept=".doc, .docx, .pdf"
          :on-remove="handleRemove"
          :before-remove="beforeRemove"
        >
          <el-button type="primary" icon="el-icon-upload" @click="upload">点击上传</el-button>
        </el-upload>
      </el-form-item>
</el-form>

export default {
  components: {},
  props: [],
  data() {
    return {
    formData:{
    field:""
    },
     fieldfileList:[],
     fieldAction: "https://jsonplaceholder.typicode.com/posts/",
     file:"",
    }
  },
  computed: {},
  watch: {},
  created() {},
  mounted() {},
  methods: {
     fieldBeforeUpload(file) {
      let isRightSize = file.size / 1024 / 1024 < 2;
      if (!isRightSize) {
        this.$message.error("文件大小超过 2MB");
      }
      return isRightSize;
    },
     handleChange(file, fileList) {
      console.log(fileList);
      if (fileList.length > 1) {
        console.log(fileList);
        this.fieldfileList = [fileList[fileList.length - 1]];
      }
    },
     handleRemove(file, fileList) {
      // console.log(file, fileList);
      this.fieldfileList = [];
    },
     beforeRemove(file, fileList) {
      return this.$confirm(`确定移除 ${file.name}？`);
    },
    getFile(item) {
      // console.log(item.file);
      this.file = item.file;
    },
    upload(){
     let formData = new FormData();
        formData.append("files", this.file);
        //将文件上传给后台
        uploadFileTB(formData).then((res) => {
        //获取上传的文件地址
        })
    },
  }
}