<button @click.stop='func'>按钮</button>
vue提供了一些按键修饰符,如space、arrawLeft、arrawright、enter、esc等。使用这些修饰符只有按下指定按键才会执行对应的事件,其它的key可以通过keycode自行判断。
<input @keyup.enter='func'/>
只有按下enter键的时候函数才会执行
有一些按键在ie9中有不同的key值,按键修饰符对此做了兼容
//shit + c <input @keyup.shift.67='func'/> //click + ctrl <div @click.ctrl='func'>点击</div>
系统修饰键可以与点击事件keyCode一同使用
.exact修饰符用来精准的控制系统按键的执行方式
//摁住shift + 任意键进行点击都会执行 <div @click.shift='func'>点击</div> //有且仅有shift键被按下的时候才执行 <div @click.shift.exact='func'></div> //没有任何系统修饰符时候才执行 <div @click.exact='func'></div>
//鼠标左键执行 <div @click.left="childClick"></div> //鼠标右键执行,并阻止默认行为(取消右键菜单) <div @click.right="childClick"></div> //摁下鼠标滚轮执行 <div @click.middle="childClick"></div>
.lazy 用于优化v-model,将数据更新延迟至失去焦点,减少数据更新的频率。
<input v-model.lazy='val'/>
.number 将输入的文本类型转为数字,不合法的值会在失去焦后被清除(与type=number效果相同)
<input type='text' v-model.number='val'/>
.trim 去除文本输入中多余的空格,相当于字符串的trim方法
<input type='text' v-model.trim='val'/>