zoukankan      html  css  js  c++  java
  • vue报key值重复时解决办法Duplicate keys detected: ''.This may cause an update error.

    1. vue报key值重复
      Duplicate keys detected: ‘’.This may cause an update error.

    2. 为什么for循环后要加key值,否则会爆红,会产生什么影响?
      for循环读取key值时, key需要是唯一的,如果key值重复会导致报错,影响页面渲染卡顿。

    3. 出问题的代码

     <el-col :span="1" v-for="(one,index) in scope.row.day" :key="one">
                    <div class="grid-contentA border borderB">{{index}}</div>
                    <div class="grid-contentA border borderB grid-color">{{one}}</div>
                  </el-col>
    

    4.解决办法

    <el-col :span="1" v-for="(one,index) in scope.row.day" :key="one.id+'A'">
                    <div class="grid-contentA border borderB">{{index}}</div>
                    <div class="grid-contentA border borderB grid-color">{{one}}</div>
                  </el-col>
    

    在:key=“one”的值重复了,需要修改成,如,只要key值是惟一的都可以

    <div v-for="(item, i) in items" :key="i"></div>
    
    <div v-for="(item, i) in items2" :key="'A'+ i"></div>
    
    <div v-for="(item, i) in items3" :key="'B',+ i"></div>
    
  • 相关阅读:
    解决hung_task_timeout_secs问题【方法待校验】
    C++面向对象程序设计 学习心得
    试水训练1
    并查集
    ACM儿童节热身训练
    图论部分学习小结
    ACM儿童节热身训练
    堆及其应用学习小结
    ACM本周小结
    POJ-3273-Monthly Expense
  • 原文地址:https://www.cnblogs.com/guanhuohuo/p/12526196.html
Copyright © 2011-2022 走看看