Vue--按键修饰符（逐个学习按键修饰符）
在监听键盘事件时，我们经常需要检查常见的键值。Vue 允许为 v-on 在监听键盘事件时添加按键修饰符：
1 <!-- 只有在 `keyCode` 是 13 时调用 `vm.submit()` --> 2 <input v-on:keyup.13="submit">
记住所有的 keyCode 比较困难，所以 Vue 为最常用的按键提供了别名：
1 <!-- 同上 --> 2 <input v-on:keyup.enter="submit"> 3 4 <!-- 缩写语法 --> 5 <input @keyup.enter="submit">
全部的按键别名：
.enter.tab.delete(捕获“删除”和“退格”键).esc.space(空格键).up.down.left.right
我们也可以自定义按键
1 <html> 2 <head> 3 <title>Vue按键修饰符</title> 4 <script src="vue.js"></script> 5 <style type="text/css"> 6 </style> 7 </head> 8 <body> 9 <div id="example"> 10 <ul> 11 <li v-for="item in items"> 12 {{ item.name }} 13 </li> 14 </ul> 15 <button @keyup.f1="del()">删除</button> 16 </div> 17 <script> 18 Vue.config.keyCodes.f1 = 112; 19 new Vue({ 20 el:"#example", 21 data:{ 22 items:[ 23 {name:"Hello"}, 24 {name:"world"}, 25 {name:"喜欢"}, 26 {name:"happy"} 27 ] 28 }, 29 methods:{ 30 del(){ 31 this.items.pop(); 32 } 33 } 34 }) 35 </script>
甚至可以这样添加多个
1 Vue.config.keyCodes = ｛ 2 f1:112,
// 可以添加多个 3 ............ 4 ............ 5 ............ 6 7 8 ｝
