Vue报错之(Emitted value instead of an instance of Error) Do not use v-for index as key 吧啦吧啦全身变

99封情书 提交于 2020-01-20 07:08:05

在这里插入图片描述众所周知,在Vue中使用列表渲染需要加上key值作为每一个子元素的唯一索引。

至于为什么是众所周知,请移步我另一篇文章https://blog.csdn.net/qq_38280242/article/details/102992064

原来这样使用没有问题,当我给列表渲染组件加上了动画效果时出现了如下报错

Do not use v-for吧啦吧啦全身变。

查阅资料

报错的意思是:在子元素上,不要使用v-for索引作为键,否则与不使用键相同

知其然,不知其所以然。

不用index作为v-for的值。,但是key又必须是唯一的才能确定子组件的唯一性。

那么我就在列表渲染的所有数据中加上了唯一的id值。

v-for的值设为:key=’‘item.id’’。这样既解决了key的唯一性问题,又确保了key的值不为index

关于数据方面是否有唯一的id值。根据我常年白嫖网上免费的api接口可以确定。

数据应该是有唯一id值的。所以我认为这种解决方法是我觉得最好的。

对了 之前查阅资料看到网上有人这样解决问题

v-for:=’’’(item,idx) in arrlist’ :key=’’‘idx’

我当时就想着,这样设置的idx本质上不还是index吗。我照着改之后果然报错了。很好奇那位同学是怎么通过改index的变量名来解决这个报错的。
————————————————
版权声明:本文为CSDN博主「叽里咕噜写代码」的原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接及本声明。
原文链接:https://blog.csdn.net/qq_38280242/article/details/103096031

标签
易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!