el-table加上v-if顺序混乱问题解决

element ui使用过程中有很多坑,先看效果图:

 代码是这样写的:

....
....
....
....
....

 百度了很多都是给el-table-column 加key,但还是不行,不能从根本解决数据错乱问题

el-table加上v-if顺序混乱问题解决_第1张图片

 换上v-show就把所以的数据都渲染出来了,不是我们想要的解决方法。

后面把div换成template就可以了,原因是template是vue的语法。能有效兼容v-if,

template是模板占位符,可帮助我们包裹元素,而且循环过程当中,template不会被渲染到页面。

上代码:





成功效果图:能成功根据判断条件渲染正确的数据

你可能感兴趣的:(element,前端,前端,javascript,html,elementui)