先来看一下效果:
使用template的插槽实现数据提醒
关键部分:
<template slot-scope="scope">
{{ scope.row.studentid }}
<p v-if="scope.row.value == 1">数据重复</p>
</template>
具体部分:
html:
<el-table-column
align="center"
prop="workid"
label="工号"
width="100"
>
<template slot-scope="scope">
{{ scope.row.studentid }}
<p v-if="scope.row.value1 == 1" class="tip">数据重复</p>
</template>
</el-table-column>
<el-table-column
align="center"
prop="organization"
label="组织"
width="150"
>
</el-table-column>
js:
data() {
return {
// 表格
tableData: [
{
name: "刘冬冬",
workid: "111111",
college: "软件工程系",
organization: "xxx",
grade: "2020",
gender: "男",
phone: "120***1111",
studentstatus: "在籍",
value1: "1",
},
],
};
},