vue el-table中使用el-select選中後無效的解決

Posted on by

el-table使用el-select選中後無效

需求：表格中一行顯示一條數據，數據中的某個屬性要展示一列，並且再另一列中用el-select用作選擇修改，修改後提示用戶是從從原來的狀態改為新狀態。

表格數據從服務器返回，為瞭修改時獲取原來的狀態和新狀態，給每一行數據新增瞭一個字段，但是點擊下拉框的時候發現下拉框選擇後沒有生效，

幾經調整後發現是添加新字段的原因 

 服務器返回數據：returnData:數組 

    this.users = returnData
    this.users.forEach(item=>{
        item.newState = parseInt(item.state)
    })

應該改成

    returnData.forEach(item=>{
        item.newState = parseInt(item.state)
    })
    this.users = returnData

el-table中selectable的使用

html代碼

<el-table-column
    type="selection"
    width="55"
    :selectable="selectable"
    :reserve-selection="true"
    align="center">
</el-table-column>

js代碼

 //判斷是否禁用
checkStatus(row, index){
    if(this.arr.some(el=>{return el===row.id})){
         return false;
    }else{
         return true;
    }
 },        

以上為個人經驗，希望能給大傢一個參考，也希望大傢多多支持WalkonNet。

推薦閱讀：