1 DOCTYPE html>
2 <html>
3 <head>
4 <meta charset="UTF-8" />
5 <title>键盘事件title>
6 <script type="text/javascript" src="../js/vue.js">script>
7 head>
8 <body>
9
27 <div id="root">
28 <h1>hello， {{name}}h1>
29
30 <input type="text" placeholder="按下ctrl+y提示输入" @keyup.ctrl.y="showInfo" >
31 div>
32 body>
33
34 <script type="text/javascript" >
35 Vue.config.productionTip = false;// 阻止 vue 在启动时生成生产提示。
36 // Vue.config.keyCodes.huiche = 13; // 自定义键名也不推荐
37 let vm = new Vue({
38 el: '#root',
39 data: {
40 name: 'Jack'
41 },
42 methods: {
43 showInfo(event){
44 console.log(event.key, event.keyCode); // key是按键名，keyCode是按键码
45 // if (event.keyCode !== 13){ // 在Vue中你不用亲自去判断这个，keyup，keydown有专门的修饰符
46 // return;
47 // }
48 // console.log(event.target.value);
49 },
50 }
51 })
52 vm.$mount('#root') // el的第二种写法
53 script>
54 html>