写了一个隐藏一列的方法，一直报错KEY没有定义，但是页面上定义了

Question

写了一个隐藏一列的方法，一直报错KEY没有定义，但是页面上定义了，并且我在项目的其他页面复用的时候都是可以用的，就单独这一个页面报错，检查了key是定义了的，开始我以为重名，然后把名字重新定义了一遍之后，还是一直报这个错误!也不是页面缓存问题，还请大神指教  <li>                      <el-checkbox-group v-model="columnChangeList" v-for="(listData,index) in columnsList" :key="listData.dataIndex">                        <el-checkbox :label="listData.dataIndex" @change="columnChange">{{listData.text}}</el-checkbox>                      </el-checkbox-group> </li>

Answer 1

应该是你的key值有相同的值。

建议你使用v-for的index索引当key，这样肯定不会重复。

<li>

  <el-checkbox-group v-model="columnChangeList" v-for="(listData,index) in columnsList" :key="index">

    <el-checkbox :label="listData.dataIndex" @change="columnChange">

      {{listData.text}}

    </el-checkbox>

  </el-checkbox-group>

</li>