请问一下如何实现以下el-table根据设置值动态变色？

  • Z时代
  • 2024-03-01
  • 分类：IT

请问一下如何实现以下el-table根据设置值动态变色？

        <div class="tab">
            <el-table :data="list" border style="width: 100%;" :cell-style="addClass"
                :header-cell-style="{ background: '#ecf5ff' }" height="100%" width="100%">
                <el-table-column prop="eqptName" label="设备名称" align="center">
                </el-table-column>
                <el-table-column prop="average" label="平均值" align="center">
                    <template slot-scope="scope">
                        {{ scope.row.average }}%
                    </template>
                </el-table-column>
                <el-table-column v-for="(item, index) in tableOption" :key="index" :label="item.date" :prop="index"
                    align="center">
                    <template slot-scope="scope">
                        {{ scope.row.values[index].value }}%
                    </template>
                </el-table-column>
            </el-table>
        </div>

其中部分列是根据后台数据动态生成的，请问如何给动态列变颜色？通过弹出层设置又该如何实现？

回答：

一般来说都是自己在 el-table-column 上绑定 style 来写行内样式，具体的颜色就可以自己写一个函数来返回，就可以高度的自定义颜色和区间范围。
也可以通过 cell-class-name 属性来处理，但是这样的话，就没有办法修改颜色值的。只能修改判断的区间范围。

以上是 请问一下如何实现以下el-table根据设置值动态变色？ 的全部内容， 来源链接： utcz.com/p/933146.html

回到顶部