<el-table
:data="tableData"
stripe
:row-style="tableRowStyle"
:header-cell-style="headerCellStyle"
@selection-change="selectMultipleWarning"
:max-height = 560
style="width: 100%;">
<el-table-column
type="selection">
</el-table-column>
<el-table-column
prop="createTime"
width="180"
label="报警时间">
</el-table-column>
<el-table-column
width="120"
prop="deviceId"
label="设备ID">
</el-table-column>
<el-table-column
width="180"
prop="sysArea.areaName"
label="设备名称">
</el-table-column>
<el-table-column
prop="device.location"
label="安装位置">
</el-table-column>
<el-table-column
prop="lineType"
label="回路名称">
<template slot-scope="scope">
<span v-if="scope.row.lineType == 1">过欠压</span>
<span v-if="scope.row.lineType == 2">电弧</span>
<span v-if="scope.row.lineType == 3">过载</span>
<span v-if="scope.row.lineType == 4">超温</span>
<span v-if="scope.row.lineType == 5">漏电</span>
<span v-if="scope.row.lineType == 6">烟雾</span>
<span v-if="scope.row.lineType == 7">联动</span>
</template>
</el-table-column>
</el-table>
主要是:row-style="tableRowStyle" :header-cell-style="headerCellStyle"
methods: {
tableRowStyle({row,rowIndex}){
return 'text-align:center'
},
headerCellStyle({ row, column, rowIndex, columnIndex }){
if (rowIndex === 0) {
return 'text-align:center'
}
}
},
我主要需要实现居中的效果,封装的居左的,如果修改背景颜色什么的可以在return后面修改成自己需要的样式。