component lists rendered with v-for should have explicit keys

发现问题

关键报错

具体原因解释

用v-for渲染的组件列表应该有显式的键

具体代码

  <el-timeline-item :timestamp="blog.created" placement="bottom" color="rgb" icon="el-icon-s-comment"
                          v-for="blog in blogs">
          <el-card>
              .....

解决问题

参考官网

建议尽可能在使用 v-for 时提供 key attribute，除非遍历输出的 DOM 内容非常简单，或者是刻意依赖默认行为以获取性能上的提升。

因为它是 Vue 识别节点的一个通用机制，key 并不仅与 v-for 特别关联。后面我们将在指南中看到，它还具有其它用途。

不要使用对象或数组之类的非基本类型值作为 v-for 的 key。请用字符串或数值类型的值。

我之前记录过关于v-for为什么指定key的笔记,具体参考:

解决

修改后的代码

  <el-timeline-item :timestamp="blog.created" placement="bottom" color="rgb" icon="el-icon-s-comment"
                          v-for="blog in blogs" :key="blog.id">
          <el-card>
              ....

总结

  <el-card>
          ....

## 总结

`vue.js 使用 v-for 一定要指定 key`