vue中 点击事件的写法_vue系列--vue是如何实现绑定事件

一、前言

vuejs中的事件绑定，使用来完成的，这里函数名是定义在Vue实例中的methods对象中的，Vue实例可以直接访问其中的方法。

二、事件绑定方式

1、 直接在标签中写js方法

执行方法的第一种写法

2、调用method的办法

执行方法的第一种写法

执行方法的 简写 写法

export default {

data () {

return {

msg: '你好vue',

list:[]

}

},

methods:{

run:function(){

alert('这是一个方法');

}

}

}

(1)方法传参，方法直接在调用时在方法内传入参数

执行方法传值111

执行方法传值2222

deleteData(val){

alert(val);

},

(2)传入事件对象

事件对象

eventFn(e){

console.log(e);

// e.srcElement dom节点

e.srcElement.style.background='red';

console.log(e.srcElement.dataset.aid); /*获取自定义属性的值*/

}

三、事件修饰符

1、stop  //阻止事件继续传播 即阻止它的捕获和冒泡过程<