前几天遇到一个关于el-table表格样式的问题一直没解决
因为在el-table-column加样式并不生效所以更改起来比较麻烦
后来了看来element官方文档和在一些关于此方面的博客，使用了一个比较笨的方法解决了问题
问题如下：我想要未开药品的字段的样式为灰色
效果如下
解决方案如下：
首先在el-table中加入cell-style
- <el-table :cell-style="set_cell_style" >
对于cell-style官方文档解释如下
然后在method方法中写上方法
- set_cell_style({row, column, rowIndex, columnIndex}){
- console.log(row,"row")
- if (column.label === '时间'){
- return 'color:black'
- }
- if (column.label === '序号'){
- return 'color:black'
- }
//这里的medicalCommonName指的是在el-table-column定义的prop中的值 - if (row.medicalCommonName === '未开药品'){
- return 'color:lightgray'
- }
- },
思路就是先让不需要改变的列字体变为黑色，因为第三个if会使得整行的字体变为灰色，所以要先把列变为黑色。这里的优先级跟if的先后顺序有关，越先定义优先级越高，所以这里定义的顺序挺重要的。
虽然这种方法有点笨但最后还是能够解决问题的，不知道有没有更好的方法。
经验首页