0
点赞
收藏
分享

微信扫一扫

vue的 v-for指令报“custom elements in iteration require v-bind:key“错误


文章目录

  • ​​1、问题描述​​
  • ​​2、解决方案:​​

1、问题描述

今天再用​​v-for​​指令进行遍历的时候出现custom elements in iteration require v-bind:key错误。

2、解决方案:

为了给Vue一个提示,以便它能跟踪每个节点的身份,从而重用和重新排序现有元素,需要为列表的每一项提供一个唯一​​key​​​属性。key属性的类型只能是​​string​​​或​​number​​​。
例如我修改之后的代码如下:

<el-timeline-item :timestamp="blog.created" placement="top" v-for="blog in blogs" :key="blog.id">
<el-card>
<h4>
<router-link :to="{name:'BlogDetail',params:{blogId:blog.id}}">
{{blog.title}}
</router-link>
</h4>
<p>{{blog.description}}</p>
</el-card>
</el-timeline-item>

注意最后面的:key=“blog.id”,

最终成功实现的博客列表的遍历效果如下所示:

vue的 v-for指令报“custom elements in iteration require v-bind:key“错误_vue.js


举报

相关推荐

0 条评论