Vue 2.0 v-for 响应式key, index及item.id参数对v-bind:key值造成差异研究

Vue 2.0 v-for 响应式key, index及item.id参数对v-bind:key值造成差异研究

Vue 2.0 v-for 响应式key, index及item.id参数对v-bind:key值造成差异研究

在github上阅览README.md以获得最佳阅读体验，点这里

v-for响应式key, index及item.id参数对v-bind:key值造成差异研究

实验背景

通常情况下，我们渲染一个li列表，采用v-for指令进行渲染，我们需要给渲染的每一项元素绑定一个key值，其实绑定该key值是可选的，但会引起警告。使用v-for参数的过程中，由于v-for提供三个参数，分别是: value, key, index。对其哪一个作为元素绑定key值更能得到我们想要的响应式渲染作出实验。

实验目的

总结出在采用不同参数作为元素绑定key值时，出现的不同的渲染结果，得出最优渲染方案

实验准备

我们准备第三个可以作为绑定key值的变量，分别是:

• 渲染item自带属性id
• v-for提供的key
• v-for提供的index

我们制定一个参照表格

---

li绑定key值类型	id	index	key
实验一	选取	x