vue-elementui中el-table跨页选择和v-if导致列错乱/选择框无法显示

在vue-elementui中使用el-table,当type="selection"的时候,分页数据进行不同页跳转选择

需要这种功能的时候我们需要在el-table的标签上为每个el-table-column都创建一个id;所以就用到

了row-key="id"这个属性;然后我们就需要在el-table-column为type="selection"添加一个属性

reserve-selection;当这两个属性同时使用时就能实现我们的需求不能重置我们的选择

总结一下:跳转页不重置我们的选择

1、row-key="id"

2、reserve-selection

当然你想要获取到选择的数据就需要用到selection-change的这个方法了

接下来咱们说一说这个el-table-column上面使用v-if指令的问题

当我们的每一列错开使用v-if或者判断的时候我们会发现明明排好的列会随意的变动,这个时候我

们就需要注意一个属性了,就是这个key属性,这个key属性能帮我们排好序,不会让我们使用v-if

或者v-show的时候造成列的错乱

posted @ 2024-06-03 11:15  醒日是归时  阅读(235)  评论(0编辑  收藏  举报