Element UI报错总结

vue控制台报错Duplicate keys detected: ‘xxxx’. This may cause an update error.解决方案

        <el-form-item label="商品名称" prop="goods_name">
          <el-select
            v-model="addFormField.goods_name"
            placeholder="请选择"
            @change="changeGoodsName"
          >
            <el-option
              v-for="item in goods"
              :key="item.goods_code"
              :label="item.goods_name"
              :value="item.goods_code"
            ></el-option>
          </el-select>
        </el-form-item>

上面这样子写报错

只要一进入该页面，就会出这个红色的错误，网上查了资料，说是v-for循环里，key值可能重复了，所以会报这个错。查看了下，页面果然有v-for循环.
key值是必须唯一的，如果重复就会报错可以把key值改为index（其实就是用索引做key值），就可以避免这个情况：

    <el-form-item label="商品名称" prop="goods_name">
      <el-select
        v-model="addFormField.goods_name"
        placeholder="请选择"
        @change="changeGoodsName"
      >
        <el-option
          v-for="(item,index) in goods"
          :key="index"
          :label="item.goods_name"
          :value="item.goods_code"
        ></el-option>
      </el-select>
    </el-form-item>