vue :key的说明 看到这文章,解决你的疑问
:key是为vue的响应式渲染提供方法,在列表中单条数据改变的情况下,可以进行单独渲染,减少页面资源消耗。 当前页面如果有列表渲染v-for,并且在v-for的循环标签中没有:key元素时,控制台会出现警告,我想对代码有比较高追求的开发者都不会允许这一大片的黄色出现的吧,如下图v-for 默认行为试着不改变整体,而是替换元素。迫使其重新排序的元素,你需要提供一个 key 的特殊属性:...
·
这是一个系列,记录我前端开发常用的代码,小常识,有些是参考网上代码,(讲的可能有点烂,求不要打脸,嘤嘤嘤~~)送给那些需要的人。可以相互交流,喜欢的加我吧。
Wx: Lxp911221
Vue2.0 v-for 中 :key 到底有什么用?点击查看原文
:key是为vue的响应式渲染提供方法,在列表中单条数据改变的情况下,可以进行单独渲染,减少页面资源消耗。
当前页面如果有列表渲染v-for,并且在v-for的循环标签中没有:key元素时,控制台会出现警告,我想对代码有比较高追求的开发者都不会允许这一大片的黄色出现的吧,如下图
v-for 默认行为试着不改变整体,而是替换元素。迫使其重新排序的元素,你需要提供一个 key 的特殊属性:
// 注意 item.id 中 id为item项中存在的唯一标识
可以直接item,用index不生效,
*注意:页面删除某个item项,需要key值,不然出现状态错乱,亲测
<div v-for="(item, index) in items" :key="item.id">
{{ item.text }}
</div>
一般来说,使用:key=”items.id”的属性有利于代码的优化,减少页面资源消耗
更多推荐
已为社区贡献3条内容
所有评论(0)