vue 中給element-ui組件事件添加自定義參數

原因:

　　有時同一個頁面會多次使用組件, 為了區分從組件中拿到的數據,一般會給事件中添加參數用於區分

 

試例:

　　下面看兩個上傳文件均用到 el-upload 組件, 在on-success事件中拿到數據后需要區分上傳的是哪個文件

 

 錯誤的解決方案: 

 :on-success="handleAvatarSuccess(1)"
  //文件上傳
  handleAvatarSuccess(d:number,res: any, file: any,) {
    console.log(d); // 1
    console.log(res); // undefined
    console.log(file); // undefined
  }

會發現拿不到 res, file數據, 只能拿到自定義的參數

 

正確的解決方案:

:on-success="(response, file, fileList)=>handleAvatarSuccess(response, file, fileList,1)"
  //文件上傳
  handleAvatarSuccess(res: any, file: any, fileList: any, d: number,) {  
    console.log(res); // {...}
    console.log(file); // {...}
    console.log(d); // 1
  }

 

分享一刻:

蘋果營銷頁中幾個有趣的交互動畫