本文代码主要讲述了v-on绑定事件函数传参，一个元素绑定多个事件的两种写法，一个事件绑定多个函数的两种写法，修饰符的使用。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id="app">
<!-- <button v-on:click="myclick('hello','world','你好世界',$event)" >button1</button> -->
<button @click="myclick('hello','world','你好世界',$event)">点我text</button>
<!-- v-on绑定多个事件教程里这样子写，但是貌似已经不支持这样子的写法了，内联方式下事件处理器只能绑定一个方法，要是想要绑定多个事件，用下面第二行的方式-->
<!-- <button v-on="{mouseenter: onEnter,mouseleave: onLeave}">鼠标进来</button> -->
<button @mouseenter="onEnter" @mouseleave="onLeave">鼠标进来</button>
<!-- 一个事件绑定多个函数，按顺序执行，这里分隔函数可以用逗号也可以用分号-->
<button @click="a(),b()">点我ab</button>
<button @click="one()">点我onetwothree</button>
<!-- v-on修饰符 .stop .prevent .capture .self 以及指定按键.{keyCode|keyAlias} -->
<!-- 这里的.stop 和 .prevent也可以通过传入&event进行操作 -->
<!-- 全部按键别名有：enter tab delete esc space up down left right -->
<form @keyup.delete="onKeyup" @submit.prevent="onSubmit">
<input type="text" placeholder="在这里按delete">
<button type="submit">点我提交</button>
</form>
</div>
<script src="vue221.js"></script>
<script>
var vm = new Vue({
el:"#app",
methods:{
//这里是es6对象里函数写法
a(){console.log("a");},
b(){console.log("b");},
one(){
console.log("one");
this.two();
this.three();
},
two(){
console.log("two");
},
three(){
console.log("three");
},
myclick(msg1,msg2,msg3,event){
console.log(msg1+msg2+"--"+msg3);
console.log(event);
},
onKeyup(){
console.log("you press 'delete'");
},
onSubmit(){
console.log("sumited");
},
onEnter(){
console.log("mouse enter");
},
onLeave(){
console.log("mouse leave");
}
}
});
</script>
</body>
</html>