Vue中事件处理程序中如何获取绑定事件中的this(就是触发事件本身)

想要在vue中用@绑定的事件函数中获取绑定事件的元素

大概代码如下

<li class="item" @click="changeTab"></li>
<li class="item" @click="changeTab"></li>
<li class="item" @click="changeTab"></li>

methods: {
  changeTab: function() {
    // 我应该如何在这里获取触发事件的li元素呢,因为this绑定了Vue对象
  }
}

望大神帮忙解答

回答:

@click=’doSome(arg1,arg2,$event)’

回答:

两种方式

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div id="app" v-cloak>
    <ul>
        <li @click="change($event)">哈哈哈</li>
        <li @click="change($event)">啦啦啦</li>
        <li @click="change($event)">嘻嘻嘻</li>
    </ul>
    <ul>
        <li v-for="(item,index) in items" @click="changeTab(index)">{{item}}</li>
    </ul>
</div>
</body>
<script src="../vue.js"></script>
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script>
    var vm=new  Vue({
        el:"#app",
        data(){
            return{
           items:['1111','2222','3333']
            }
        },
        methods:{
            changeTab(a){
            console.log(a)
            },
            change(event){
            console.log(event.currentTarget)
            }
        }
    })
</script>
</html>

回答:

<li class="item" @click="changeTab"></li>
<li class="item" @click="changeTab"></li>
<li class="item" @click="changeTab"></li>

methods: {
  changeTab: function(e) {
     //e.target
  }
}

暂无评论

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注