element随笔

时间选择框el-date-picker和select框数据选不上:

【解决】用v-model="searchData.searchDate"，不能用:model="searchData.searchDate"

Table改变其中某一行的样式:

【解决】

<el-table>标签中有一个:row-class-name="getRowClassName"属性

getRowClassName是一个方法，返回一个class的名称

getRowClassName({row,rowIndex}){
    if(row.detail == 10 || row.detail == 12){
        return "remind";
    }
}

 .el-table .remind {
     color: red;
 }

Table改变某个单元格的样式:

【解决】<el-table>标签中有一个:cell-class-name="getVipStatusClass"属性，getVipStatusClass是一个方法，返回一个class的名称。

getVipStatusClass({row,column,rowIndex,columnIndex}){
    if(row.status == 1){
        if(columnIndex == 4){
            return "effective";
        }
    }
    if(row.status == 0){
        if(columnIndex == 4){
            return "ineffective";
        }
    }
}

.el-table .effective{
    color: #70B603;
}

.el-table .ineffective{
    color: #AAA;
}