Vue中v-for给遍历出的元素添加不同的事件

161 阅读1分钟

初用Vue时,很多人利用v-for遍历出不同节点,给各个点添加不同事件,但是不能每个元素都添加事件,下面是添加事件的方法

个人例子

<div class="tit">
    <div class="tit1" v-for="(item,index) in tit1" :key="index" @click="rout(item.id)">{{item.tit}}</div>
</div>

//data部分

    data() {
      return {
        tit1: [{tit:'政务云',id:'tit11'}, {tit:'政务网',id:'tit22'},{tit:'政务服务平台',id:'tit33'}],
    }
},


    methods: {
        rout(id){      this[id]()    },   
            tit11(){      console.log(11111);    },
            tit22(){      console.log(22222);    },
            tit33(){      console.log(33333);    }
},

重点是给原本的值改为对象模式,添加一个标记属性,添加方法