<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="app">
<!-- 绑定点击事件 -->
<!-- 写法一 -->
<button v-on:click="handlde1($event)">点击1</button>
<!-- 写法二 -->
<button @click="handlde2(123,456,$event)">点击2</button>
</div>
<script src="./vue.js"></script>
<script>
/*
事件绑定事件-参数传递
1.如果事件直接绑定函数名称,那么默认会传递事件对此昂作为事件函数的第一个参数
2.如果事件绑定函数调用,那么事件对象必须作为最后一个参数显示传递,并且事件对
象的名称必须是$event
<button v-on:click="handlde1($event)">点击1</button>
||相当于
<button v-on:click="handlde1">点击1</button>
*/
new Vue({
el:'#app',
data:{
num:0
},
methods:{
handlde2:function(p,p1,event){
console.log(p,p1);
console.log(event.target.innerHTML)
},
handlde1:function(event){
console.log(event.target.innerHTML)
}
}
})
</script>
</body>
</html>