vue axios原生上传 用fromdata

直接放代码吧，看一遍就会了

<template>
    <div class="upload">
      <div class="uploadT">
        <div>
          <img src="@/assets/imgs/public/wend.png"/>
          <input ref="file_a" @change="handle($event)" type="file" id="fileInput">
        </div>
        <span>{{file}}</span>
      </div>
      <div class="okUp" @click="okUp">确认保存文档</div>
    </div>
</template>

<script>
export default {
  name: 'upload',
  data () {
    return {
      file: '文件名',
      filea: '文件名',
      lhea: { 'Content-Type': 'multipart/form-data' },
      lData: {
        id: 1,
        uid: 1
      },
      fileList: []
    }
  },
  //计算属性
  computed: {},
  methods: {
    handle (e) {
      console.log(e)
      const self = this
      self.file = self.$refs.file_a.files[0].name
      console.log(self.$refs.file_a.files[0])
    },
    up (val) {
      const self = this
      self.$toast.loading({
        mask: true,
        message: '上传中...'
      })
      let formData = new FormData()
      formData.append('uid', localStorage.uid)
      formData.append('pid', localStorage.pid)
      formData.append('id', localStorage.pid)
      formData.append('image', self.$refs.file_a.files[0])
      self.$uploadAxios({
        async: true,
        method: 'POST',
        crossDomain: true,
        headers: { 'Content-Type': 'multipart/form-data' },
        url: val,
        contentType: false,
        processData: false,
        data: formData
      }).then(function (response) {
        console.log(response)
        self.$toast.clear()
        self.$toast.success('上传成功')
        self.$router.go(-1)
      }).catch((res) => {
        self.$toast.clear()
        self.$toast.fail('失败')
      })
    },
    okUp () {
      console.log(localStorage.upload)
      console.log(this.$refs.file_a.files[0])
      if (this.$refs.file_a.files[0] === undefined) {
        this.$notify({
          message: '请上传文档',
          duration: 1000,
          background: 'red'
        })
      } else if (localStorage.upload === '1') {
        console.log('标准规范')
        this.up('/api/filestandard/add')
      } else if (localStorage.upload === '2') {
        this.up('/api/filessystem/add')
        console.log('管理制度')
      } else if (localStorage.upload === '3') {
        this.up('/api/fileproject/add')
        console.log('项目信息资料')
      } else if (localStorage.upload === '4') {
        this.up('/api/Fileother/add')
        console.log('其他文档')
      }
    }
  },
  mounted () {

  },
  //初始化
  created: function () {

  }
}
</script>

<style lang="scss" scoped>
.upload{
  .uploadT{
    width: 100%;
    height: auto;
    >div{
      position: relative;
      width: 96px;
      height: 80px;
      display: block;
      margin: 0 auto;
      margin-top: 44px;
      >img{
        width: 96px;
        height: 80px;
      }
      input{
        position: absolute;
        display: block;
        top: 0;
        margin: 0 auto;
        width: 96px;
        height: 80px;
        opacity: 0;
      }
    }
    span{
      font-size:16px;
      font-family:PingFang-SC-Medium;
      font-weight:500;
      color:rgba(75,146,255,1);
      text-align: center;
      display: table;
      margin: 0 auto;
      margin-top: 30px;
      border-bottom: 1px solid #4B92FF;
    }
  }
  .okUp{
    width:345px;
    height:45px;
    background:linear-gradient(181deg,rgba(130,196,255,1) 0%,rgba(75,146,255,1) 100%);
    border-radius:4px;
    font-size:17px;
    font-family:PingFangSC-Regular;
    font-weight:400;
    color:rgba(255,255,255,1);
    line-height: 45px;
    text-align: center;
    margin: 0 auto;
    margin-top: 43px;
  }
}
</style>