[A] v-on作用
作用：用于绑定事件，如监听鼠标事件，键盘事件等
简写：@
绑定类型：Function | Inline satatment | Object
参数：event
[B] v-on的参数传递
1. 基本使用，不传参时
<button @click="addNum()">add</button> // 绑定鼠标点击事件，一旦鼠标点击，则调用函数addNum()
此时，在不传参时，函数后面的()可以不添加，即上述可改为：
<button @click="addNum">add</button>
2. 使用时传入参数时
当事件函数需要传入参数，但是调用时只写了函数名，没写()时，
则事件函数执行时，第一个参数会被浏览器定义为触发事件，其他的参数为undefined
如：
<button @click="addNumber">按钮2</button>
addNumber(a, b, c){
console.log(a, b, c);
}
// 返回结果为：MouseEvent{...} undefined undefined
// 当添加()时，即@click="addNumber()"，返回undefined undefined undefined
3. 当事件函数需要传入触发事件，还要传入其他参数时，用$event表示事件本身
如：
<button @click="addNumber(10, $event, 'hello')">按钮2</button>
addNumber(a, b, c){
console.log(a, b, c);
}
// 则事件函数调用时，按顺序给形参赋值
即a = 10, b = MouseEvent{...}, a = "hello"
[C] v-on的修饰符
v-on的修饰符很多，这些修饰符可以帮助我们方便的处理一些事件
1. .stop 阻止冒泡，即调用了event.stopPropagation()
当子元素和父元素都绑定了同一类事件时，触发子元素，事件会进行冒泡，父元素也会被触发
如：
<div @click="divClick()">
<button @click="btnClick()">修饰符按钮</button>
</div>
当点击按钮时，会同事触发divClick()函数
要想阻止这种冒泡，可以使用.stop修饰符，即得事件添加.stop属性即可
示例：<div @click="divClick()">
<button @click.stop="btnClick()">修饰符按钮</button>
</div>
2. .prevent 阻止默认事件，即调用了event.preventDefault()
示例：在表单中，点击提交，系统会自动将信息提交到指定的地方，如果我们想要自己调用函数进行提交，就需要阻止默认提交事件
<form action="baidu">
<input type="submit" value="提交" @click.prevent="submitClick()">
</form>
3. .{keyCode | keyAlias} 监听键盘事件时，指定事件只有在特定的键上才会触发
<input type="text" @keyUp.65="keyUp($event)">
只有在键A(键码为65)按下时才会触发
4. .native 自定义组件的事件，必须加入.native才会生效
如：自定义组件<cpm @click="aClick()"></cpm>
该点击事件是无效的，需改为：
<cpm @click.native="aClick()"></cpm>
5. .once 规定事件只触发一次