vue 点击一个按钮触发两个事件_vue如何触发某个元素的单击事件?

<a class="link">1111</a>

<a class="link">2222</a>

<a class="link">333</a>

<button>点击我触发a的单击事件</button>

在jquery中单击某个按钮后可以直接用

$('a').trigger("click");

来触发a元素的单击事件

那么在vue中该如何实现?

想通过点击

<a>

标签来触发事件么？这个问题我曾经遇到过，其实是vue中把a标签的点击原生事件貌似禁用掉了。但是我们可以如下这么写，来触发这个点击事件。

<a class="link" @click.native="test">1111</a>

<a class="link" @click.native="test">2222</a>

<a class="link" @click.native="test">333</a>

<button @test='shout'>点击我触发a的单击事件</button>

<script type="text/javascript">

var vm = new Vue({

el:"#app",

methods: {

test: function () {

console.log(1);

this.$emit('test');//把a标签的点击事件分发

},

shout:function () {

console.log('我触发了它');

}

}

})

</script>

YOU WILL NOT MISS IT~~

如果你是想不通过点击来触发事件的话..

直接调用该方法就可以.

应该是v-on:click=”函数名”

绑定的事件有两种：

1、绑定事件处理器

2、绑定内联方法调用

<input type="button" name="btnGetNumber" value="增加[绑定事件处理器]" v-on:click="getNumber">

<input type="button" name="btnGetNumber" value="增加[内联方法调用]" v-on:click="getNumber()">

var app = new Vue({

el: '#app',

data: {

number: 1

},

methods: {

// 事件响应方法的逻辑代码

getNumber: function (e) {

this.number += 1;   // 不管是内联方法调用，还是绑定事件处理器两种方式执行事件响应方法的时候 this都是指向 app

}

}

});

传送门vue学习指南

v-on绑定事件，如果是点击事件就v-on:click=”某个方法事件”

<a v-on:click="fun" class="btn">1111</a>

如果需要传参就:

<a v-on:click="fun(arg1,arg2)" class="btn">1111</a>

也可以简写为@click=”某个事件方法”

<a @click="fun" class="btn">1111</a>

在Vue构造器里面就要写相应的methods

methods: {

fun(arg1, arg2) {},

fun2() {}

}

和操作dom一样。

<button @click="handleBtnClick">点击按钮</button>

<p @click="handleTextClick" id="text">文字</p>

methods:  {

handleBtnClick: function(){

document.getElementById("text").click();

},

handleTextClick: function(){

alert("hello");

}

}