<el-table
:data="tableData"
:header-cell-style="tableHeaderColor"
height="95%"
:cell-style="cellStyle"
style="width: 100%" :row-class-name="tableRowClassName">
<el-table-column
label="日期">
<el-table-column prop="operDate" :formatter="formatDate" width="70">
</el-table-column>
</el-table-column>
<el-table-column
label="产品型号" width="50">
<el-table-column prop="hjnd" >
</el-table-column>
</el-table-column>
<el-table-column label="喷淋链速" width="100" >
<el-table-column
prop="pllsSet"
label="设定" width="50">
</el-table-column>
<el-table-column
prop="pllsActrul"
label="实际" width="50">
</el-table-column>
</el-table-column>
<el-table-column label="喷淋风刀频率" width="120" >
<el-table-column
prop="plfdSet"
label="设定" width="60">
</el-table-column>
<el-table-column
prop="pllsActrul"
label="实际" width="60">
</el-table-column>
</el-table-column>
<el-table-column
width="50"
label="氧气浓度">
<el-table-column prop="o2nd" >
</el-table-column>
</el-table-column>
<el-table-column
width="50"
label="氮气浓度" >
<el-table-column prop="n2nd" >
</el-table-column>
</el-table-column>
<el-table-column label="干燥炉" width="300" >
<el-table-column label="1区" width="100" >
<el-table-column
prop="gzl1Set"
label="设定" width="50">
</el-table-column>
<el-table-column
prop="gzl1Actrul"
label="实际" width="50">
</el-table-column>
</el-table-column>
<el-table-column label="2区" width="100" align='center'>
<el-table-column
prop="gzl2Set"
label="设定" width="50">
</el-table-column>
<el-table-column
prop="gzl2Actrul"
label="实际" width="50">
</el-table-column>
</el-table-column>
<el-table-column label="3区" width="100" align='center'>
<el-table-column
prop="gzl3Set"
label="设定" width="50">
</el-table-column>
<el-table-column
prop="gzl3Actrul"
label="实际" width="50">
</el-table-column>
</el-table-column>
</el-table-column>
<el-table-column label="预热炉" width="300" >
<el-table-column label="1区" width="100" >
<el-table-column
prop="yrl1Set"
label="设定" width="50">
</el-table-column>
<el-table-column
prop="yrl1Actrul"
label="实际" width="50">
</el-table-column>
</el-table-column>
<el-table-column label="2区" width="100" >
<el-table-column
prop="yrl2Set"
label="设定" width="50">
</el-table-column>
<el-table-column
prop="yrl2Actrul"
label="实际" width="50">
</el-table-column>
</el-table-column>
<el-table-column label="3区" width="100" >
<el-table-column
prop="yrl3Set"
label="设定" width="50">
</el-table-column>
<el-table-column
prop="yrl3Actrul"
label="实际" width="50">
</el-table-column>
</el-table-column>
</el-table-column>
<el-table-column label="钎焊炉" width="400" >
<el-table-column label="1区" width="100" >
<el-table-column
prop="qhl1Set"
label="设定" width="50">
</el-table-column>
<el-table-column
prop="qhl1Actrul"
label="实际" width="50">
</el-table-column>
</el-table-column>
<el-table-column label="2区" width="100">
<el-table-column
prop="qhl2Set"
label="设定" width="50">
</el-table-column>
<el-table-column
prop="qhl2Actrul"
label="实际" width="50">
</el-table-column>
</el-table-column>
<el-table-column label="3区" width="100" align='center'>
<el-table-column
prop="qhl3Set"
label="设定" width="50">
</el-table-column>
<el-table-column
prop="qhl3Actrul"
label="实际" width="50">
</el-table-column>
</el-table-column>
<el-table-column label="4区" width="100" >
<el-table-column
prop="qhl4Set"
label="设定" width="50">
</el-table-column>
<el-table-column
prop="qhl4Actrul"
label="实际" width="50">
</el-table-column>
</el-table-column>
</el-table-column>
</el-table>
要对后端传来的时间进行处理
// 用来格式化内容
formatDate(value){
return value.operDate+':00'
},
重点的代码:
例后端返回的operDate:‘14’,前端需要的格式是“14:00”
在要处理的数据的el-table-column行内写上:formatter="formatDate",在methods里写上
formatDate(value){
return value.operDate+':00'
},复制代码
vue中使用element-ui的表格时,对数据的处理
最新推荐文章于 2024-06-12 08:00:00 发布