1. 程式人生 > >element上傳圖片的時候額外引數

element上傳圖片的時候額外引數

<el-upload
   class="avatar-uploader"
   action="123"
   :http-request="upLoad"(自定義上傳)
   :show-file-list="false"
   :on-success="handleAvatarSuccess"
   :before-upload="beforeAvatarUpload">
   <img :src="imgurl" alt="">
   <el-button size="small" type="primary">點選上傳</el-button>
</el-upload>


imgurl: '',
// 自定義上傳圖片
    upLoad (file) {
      var nikename = sessionStorage.getItem('nikename')
      const formData = new FormData()
      formData.append('file',file.file)
      formData.append('nikeName',nikename)
      this.axios.post(`/admin/file`,formData).then(res => res.data)
      .then(data => {
        console.log(data)
        if(data.code === 200){
          this.imgurl = data.data[0]
        }
      })
    },
    beforeAvatarUpload(file) {
      const isJPG = file.type === 'image/jpeg';
      const isLt2M = file.size / 1024 / 1024 < 2;

      if (!isJPG) {
        this.$message.error('上傳頭像圖片只能是 JPG 格式!');
      }
      if (!isLt2M) {
        this.$message.error('上傳頭像圖片大小不能超過 2MB!');
      }
      return isJPG && isLt2M;
    },

可以自定義引數,加別的引數一起上傳。如果要修改的話,

if (data.code === 200) {
  this.list = data.data
  this.imgurl = this.list[0].photo
}

在頁面加載出來的時候先獲取頭像