在监听键盘事件时，我们经常需要检查详细的按键。Vue 允许为 v-on 在监听键盘事件时添加按键修饰符：这是一个键盘事件,修饰符为enter,按下enter键后会触发这个事件
<input v-on:keyup.enter="submit">
使用 keyCode attribute 也是允许的：不过已经被淘汰了了解一下就行了
<input v-on:keyup.13="submit">
你还可以通过全局 config.keyCodes 对象自定义按键修饰符别名：
Vue.config.keyCodes.f1 = 112
以下是我使用的过程
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>按键修饰符</title>
<script type="text/javascript" src="vue.js"></script>
</head>
<body>
<div id="vueDiv">
<button v-on:keyup.enter="submit()">提交</button>
<button v-on:keyup.page-down="pageDown()">pageDown</button>
</div>
</body>
<script>
new Vue({
el:"#vueDiv",
data() {
return {
msg:"按键修饰符"
}
},
methods: {
submit:function(){
alert(this.msg);
},
pageDown:function(){
alert("pageDown");
}
},
})
</script>
</html>
|