报错问题Vue warn]: Duplicate keys detected: ‘[object Object]’. This may cause an update error.

                     <div>
                        <el-carousel>
                            <el-carousel-item v-for="item in guideBanner" :key="item.id">  
                              <img :src="item.cover" class="banner_img" />
                            </el-carousel-item>
                        </el-carousel>
                    </div>

v-for循环遍历的时候item是一个对象，所以报错原因是 ：key=“item”绑定成了一个对象，但是绑定的要是独一无二的数值所以在：key=“item.id”绑定了一个后端给的独一无二的字段。报错消失。查看是否拿到数据使用双括号{{ item }}然后去页面中看是否有拿到后端反的数据。

****下面附上async接口的使用

<!-- 轮播图1 -->
        <div class="picture">
            <el-carousel height="600px">
                <el-carousel-item v-for="item in banners" :key="item.id" >
                    <el-image :src="item.cover" class="banner_img" />
                </el-carousel-item>
            </el-carousel>
        </div>

export default {
data(){
  return{
     banners:[], //循环遍历的数组
  }
 }
}

 created(){
        this.getBanner();
    },

methods:{
   //首页轮播图
      async getBanner(){
        let res = await home();
        this.banners = res.home_banner;
       // this.guideBanner = res.guide_banner  同个接口，同个页面下的banner调用方法相同
    },
}