目录
一、事件绑定
1、点击事件两种写法
@click="handleClick"
@click="handleClick($event)"
$event可以对dom元素进行获取或修改标签的属性
2、阻止form表单提交的默认事件
1.在表单上绑定事件@click="handleClick"，方法中写e.preventDefault()
2.直接在表单上绑定事件@click.prevent
事件修饰符
click.prevent
click.stop 阻止事件向外冒泡
click.self 只有点击绑定的标签本身才会触发事件
click.once 一次性事件，执行过以后接绑
click.capture 捕获事件，由外向内执行，与冒泡相反
click.native 可以给组件绑定原生事件
按键修饰符
@keydown 按键按下时触发事件
keydown.enter 按下回车键时触发事件
keydown.tab 按下tab键时触发事件
系统修饰符
keydown.ctrl 同时按住ctrl键,事件才会触发
keydown.alt
keydown.shift
keydown.mate
鼠标按键修饰符
@click.right/left/middle 鼠标右键点击/左键点击 事件分别触发
二、表单绑定
v-model 可以与单行文本框、多行文本框、单选、复选、select等标签绑定
vue表单绑定修饰符
1、v-model.lazy //文本框失去焦点时渲染
2、v-model.number //将输入内容转化为数字类型
3、v-model.trim // 读取input框的内容，然后去除首尾的空格