鍍金池/ 問答/HTML/ vue element-UI table 表格如何強(qiáng)制重新渲染數(shù)據(jù)?

vue element-UI table 表格如何強(qiáng)制重新渲染數(shù)據(jù)?

1.點擊查看隱藏當(dāng)前按鈕和這個內(nèi)容,顯示另一個內(nèi)容能。
圖片描述
2.剛開始是手動display:none,發(fā)現(xiàn)翻頁后,下一頁當(dāng)前單元格none的效果竟然依然在。
3.于是我試圖

<el-table-column label="rfid值" align="center" v-if="value222">
  <template slot-scope="scope">
    <span v-if="!scope.row.ifShow">
      <span :id="scope.row.rfid">{{ scope.row.rfid|rfid}}</span>
      <el-button type="text" @click="showrfid($event,scope.row)">查看</el-button>
    </span>
    <span v-else>{{scope.row.rfid}}</span>
  </template>
</el-table-column>

點擊的時候給scope.row添加個ifShow屬性,添加是添加上了,但是表格并不會因為這個重新渲染。
似乎只會根據(jù) el-table :data="rfidInfo" 這個data重新渲染。

回答
編輯回答
咕嚕嚕

把代碼貼一下,理論上是不存在的。

https://jsfiddle.net/y4caezym/

2018年8月23日 17:05
編輯回答
兮顏

點擊事件里通過$set解決了。具體代碼:

showrfid(event,row){
  this.rfidInfo[row.$index].ifShow=true;
  this.$set(this.rfidInfo,row.$index,this.rfidInfo[row.$index]);
},

順便,感謝樓上的熱心回答。

2017年10月23日 05:17