代码 v-for='(v, k) in a' :key='v' ,问题

来源:3-6 Vue的原生指令

kingHawkWin

2019-02-26

首先
typeof a === ‘array’

当数据项相同,且:key='v’会报错

代码示例:

<template lang="pug">
  div
    ul
      li(
        v-for='(v, k) in a'
        :key='v'
      ) {{v}} -- {{k}}
</template>

<script>
export default {
  data(){
    return {
      a: [2,2,4],
    }
  },
}
</script>
[Vue warn]: Duplicate keys detected: '2'. This may cause an update error.

found in

---> <App> at app.vue
       <Root>

请问怎么解释?

写回答

1回答

Jokcy

2019-02-26

因为你a数组里面有两个2,所以你的在一个v-for中有相同的key,这明显就是不符合的,因为一个v-for中不能有相同的key。

0
4
Jokcy
回复
kingHawkWin
对的,一般后端数据是会有这种唯一值的。key需要保证唯一性。
2019-03-01
共4条回复

Vue核心技术 Vue+Vue-Router+Vuex+SSR实战精讲

深入讲解Vue核心技术,展示Vue应用开发中的各种问题和解决方案

3168 学习 · 853 问题

查看课程