element-ui怎麼調節表格中某一列的樣式
阿新 • • 發佈：2021-09-01
想用element-ui實現，表格中某一個，或者某一行樣式
怎麼設定單元格某一列，或者其他樣式
<divclass="table">
<template>
<el-table
:data="tableData_i"
border
style="width:96%;margin-left:14px"
:default-sort="{prop:'name1',order:'descending'}"
:header-cell-style="{textAlign:'center'}"
:cell-style="cellStayle">
<el-table-columnsortableprop="name1"label="支付時間"width="200"></el-table-column>
<el-table-columnprop="name2"label="所屬站臺"width="115"></el-table-column>
<el-table-columnprop="name3"label="訂單編號"width="300"></el-table-column>
<el-table-columnprop="name4"label="商戶訂戶單"width="300"></el-table-column>
<el-table-columnprop="name5"label="第三方訂戶單"width="300"></el-table-column>
<el-table-columnprop="name6"label="交易型別"width="150"></el-table-column>
<el-table-columnprop="name7"label="交易金額"></el-table-column>
</el-table>
</template>
</div>
在函式 moethods：{
//row表示某一行除操作外的全部資料
//column為某一列的屬性
//rowIndex為某一行
//columnIndex為某一列
cellStayle({row,columnIndex}){
if(columnIndex===5&&row.name6=='微信支付'){
return'color:green'
}else{
return '如果條件都不成立則返回'
},
}
cellStayle({row,columnIndex}){ if(columnIndex===5&&row.name6=='微信支付'){ return'color:green' }elseif(columnIndex===5&&row.name6=='支付寶支付'){ return'color:red' } },
cellStayle({row,columnIndex}){ if(columnIndex===5&&row.name6=='微信支付'){ return'color:green' }elseif(columnIndex===5&&row.name6=='支付寶支付'){ return'color:red' } },