vue数组中有相同的数据处理
跟ng一样,vue的数组中有相同的数据时会报错Uncaught (in promise) TypeError例如:{{item.message}}data:{items:[{ message: 'Foo' },{ message: 'Bar' }
·
跟ng一样,vue的数组中有相同的数据时会报错Uncaught (in promise) TypeError
例如:
<li v-for="item in items">
{{item.message}}
</li>
data:{
items:[
{ message: 'Foo' },
{ message: 'Bar' },
{ message: 'Foo' },
{ message: 'Bar' },
{ message: 'Foo' },
{ message: 'Bar' }
],
在这种情况下会报错,以为items数组中有相同的数据,解决的办法跟ng有点类似,ng是track by $index ,vue是track-by="$index"
<li v-for="item in items" track-by="$index">
{{item.message}}
</li>
如果没有唯一的键供追踪,可以使用 track-by="$index",它强制让 v-for 进入原位更新模式:片断不会被移动,而是简单地以对应索引的新值刷新。这种模式能处理数据数组中重复的值
注:本文仅是本人学习过程的一些经验,如有任何问题,欢迎留言交流
希望我的入坑经验对你有所帮助,愿圣光与你同在
更多推荐
已为社区贡献1条内容
所有评论(0)