在使用elementUI开发项目时,发现el-table组件 el-table-column标签使用v-if判断,初次显示正常,第二次就会出现错乱问题。
解决方法:在el-table-column标签上加 key值
<el-table-column type="selection" width="55" align="center"
v-if="tabIndex == 'tab1'||(type==2 && tabIndex=='tab2')" key="1"/>
key
是 Vue.js 中用于跟踪每个节点的唯一性标识。在动态渲染的列表或表格中,当列表或表格的顺序改变时,Vue 将无法准确追踪每个节点的身份,从而导致性能下降和可能的渲染错误。通过为每个el-table-column
提供一个唯一的key
,Vue 可以确保每个列的唯一性,并在数据发生变化时正确地重新渲染。