王德发,我都不敢相信

这个坑是在我封装饿了么的表格组件时候出现的,我一路正常操作,正常props传递,正常遍历,正常写插槽,tm的页面渲染的顺序不对,反复排查找不出问题,因为实在是看不出问题在哪。

先看代码

父组件:user.vue
vue v-for循环乱序踩坑
封装的组件:simple-table.vue
vue v-for循环乱序踩坑

数据源:user.js
vue v-for循环乱序踩坑
可是打印的数据是这样的:
vue v-for循环乱序踩坑
王德发,???什么玩意。

好吧,找度娘

vue v-for循环乱序踩坑
发现并没什么用,因为我已经绑定唯一的key了。

好吧,自己动手

通过打印发现,在create生命周期里,props传递的值并没有被改变。那杂肥事呢?想了个办法,重新赋值,试试吧。
vue v-for循环乱序踩坑
咦,解决了。但这不是我想要的。后来经过群友“志帅哥哥”的解答,是因为里面表格里写了个div。嗯还是我粗心大意了啊。以此为警。

相关文章: