vue 遍历报红解决

报红

常规v-for操作遍历时出现报红，实际页面显示是正常的

<template>
  <div class="users">
    <ul>
      <li v-for="user in users">{{ user }}</li><!--此时此处报红--> 
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      users: ["p", "a", "c"],
    };
  },
};
</script>
<style>
</style>

解决办法

绑定唯一key值，唯一默认下标

<template>
  <div class="users">
    <ul>
      <!-- <li v-for="user in users"></li> -->
      <li v-for="(user, index) in users" :key="index">{{ user }}</li>
    </ul>
  </div>
</template>

<script>
export default {
  data() {
    return {
      users: ["p", "a", "c"],
    };
  },
};
</script>


<style>
</style>