elementUi中的el-table表格的内容根据后端返回的数据用不同的颜色展示

效果图如下:

首先elementUi中的el-table表格的内容根据后端返回的数据用不同的颜色展示_第1张图片

首先:需要在表格行加入 标签

 
            
          

 2.在methods里面加入这个方法:

elementUi中的el-table表格的内容根据后端返回的数据用不同的颜色展示_第2张图片

  fontLightClass(usable){
      if(usable == true){
    		return 'fgreen'
    }else{
      return 'fred'
    }
    },

 3.去设置自己喜欢的颜色:

elementUi中的el-table表格的内容根据后端返回的数据用不同的颜色展示_第3张图片

//还有另一种(这种后端返回的数据里面带有背景色的字段)

elementUi中的el-table表格的内容根据后端返回的数据用不同的颜色展示_第4张图片

elementUi中的el-table表格的内容根据后端返回的数据用不同的颜色展示_第5张图片

 
          
        

 

 

你可能感兴趣的:(elementui,vue.js,javascript)