.vue中出现未使用的标签

.vue中(第四行)img :src="imgArr" alt="" imgArr显示未使用的标签

<template>
    <div class="lunbo" >
        <ul class="img_list">
            <li><a href="https://www.baidu.com/index.php?tn=monline_3_dg" target="_blank"><img :src="imgArr"  alt="">a>li>        
           <div class="pointer" >
                <a  class="active" @click="" href="javascript:;">a>
                <a href="javascript:;">a>
                <a href="javascript:;">a>
                <a href="javascript:;">a>
                <a href="javascript:;">a>
            div>
        ul>
    div>
template>
<script>

export default{
    name:"LunBo",

    data() 
    {
          imgArr:[
          "../assets/LunBo_1.jpg",
          "../assets/LunBo_2.jpg",
          "../assets/LunBo_3.jpg",
          "../assets/LunBo_4.jpg",
          "../assets/LunBo_5.jpg"
          ]
          index: 0
    },
    methods(){
            
    }
}

你的data写错了吧,少了个return,试试改了之后还会不会提示

data () {
    return {
        imgArr:[
          "../assets/LunBo_1.jpg",
          "../assets/LunBo_2.jpg",
          "../assets/LunBo_3.jpg",
          "../assets/LunBo_4.jpg",
          "../assets/LunBo_5.jpg"
          ],
        index: 0

    }
},

data要return出一个对象

  1. 组件中的 data 写成一个函数,数据以函数返回值形式定义,这样每复用一次组件,就 会返回一份新的 data,类似于给每个组件实例创建一个私有的数据空间,让各个组件实例维护各 自的数据。而单纯的写成对象形式,就使得所有组件实例共用了一份 data,就会造成一个变了全 都会变的结果
  2. img 标签循环遍历一下 imgArr 数组,把遍历的每一项放 到 :src 里 里面
<a href="https://www.baidu.com/index.php?tn=monline_3_dg" target="_blank"> <img v-for="item in imgArr" :key="item" :src="item" alt=""></a>

:src="imgArr" ,imgArr是数组类型,src的属性值是string类型。解决方案:
1、:src="imgArr",改成:src="imgArr[0]"
2、

<img v-for="item in imgArr" :key="item" :src="item"  alt="" />