element-ui 表格動(dòng)態(tài)改變某一格樣式

用到cell-style方法:

        <el-table ref="table" :cell-style="tableRowStyle" :data="tableData" border >

js 注意:與平時(shí)表格數(shù)據(jù)不同,舉例數(shù)據(jù)需要循環(huán)

重點(diǎn)?。。篺oreach失效,需要用for in ??!
tableRowStyle({ row, column, rowIndex, columnIndex }) {
      if (row.ceshi.length) {
        if (columnIndex !== 0) {
          console.log(row.ceshi, column, rowIndex, columnIndex, 'val.....')
          columnIndex = columnIndex - 1
          for (let index = 0; index < row.ceshi.length; index++) {
            if (this.postList[columnIndex].value === row.ceshi[index].postId) {
              return 'background:#F5F7FA;!important;'
            }
          }
        }
      }
    },

簡(jiǎn)單數(shù)據(jù)舉例:

tableRowStyle({ row, column, rowIndex, columnIndex }) {
  
 if (columnIndex == 0) {
        
    return 'background:#F5F7FA;!important;'

 },

ht背景色

<style lang='scss'>
.quiry{
 .el-table th.el-table__cell{
    background-color:rgb(128,100,162);
    color: #fff;
  }
}
</style>
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時(shí)請(qǐng)結(jié)合常識(shí)與多方信息審慎甄別。
平臺(tái)聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點(diǎn),簡(jiǎn)書(shū)系信息發(fā)布平臺(tái),僅提供信息存儲(chǔ)服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容