当table中表头太多了,然后不想一个一个写,可以用循环的方式写
先上个图
直接上代码文章来源:https://www.toymoban.com/news/detail-534032.html
<el-table :data="tableData">
<div v-for="(col,ii) in cols" :key="ii">
<el-table-column v-if="col.prop=='type'" :prop="col.prop" :label="col.label">
<template scope="scope">
<el-tag type="primary">{{ scope.row.type == 1 ? '是' : '否' }}</el-tag>
</template>
</el-table-column>
<el-table-column v-else :prop="col.prop" :label="col.label">
</el-table-column>
</div>
</el-table>
data数据文章来源地址https://www.toymoban.com/news/detail-534032.html
cols: [
{ label: "节点编号", prop: "node" },
{ label: "名称", prop: "name" },
{ label: "类型", prop: "type" },
{ label: "坐标", prop: "coordinate" }
],
tableData: [
{
node: "0051",
name: " 机库顶",
type: "1",
status: "正常",
coordinate: "12.21,34.45,34.6",
},
{
node: "0061",
name: "机库门",
type: "0",
status: "低电",
coordinate: "45.41,67.45,78.6",
},
],
到了这里,关于element el-table-column 循环的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!