vue2.0--學框架
阿新 • • 發佈：2018-12-11
鍵盤事件-小遊戲 事件觸發順序：keydown - > keypress - > keyup @keydown.enter 回車 @keydown.left 左鍵 @keydown.right 右鍵 @keydown.up 上鍵 @keydownp.down 下鍵 @keydown.delete 刪除鍵
demo
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>vue2.0 day2</title> <script src="../node_modules/vue/dist/vue.js"></script> <style> [v-cloak]{display: none;} *{margin:0;padding: 0;} body{font-size: 16px;color: black;} a{text-decoration: none; color: black;} #app{} #app form p label{ display: inline-block; width: 64px; height: 20px; text-align: right; } </style> </head> <body> <div id="app" v-cloak> <!-- --> <p @click.once="once">{{msg}}</p> <!-- --> <p> <input type="text" name="" @keydown.enter="keyEnter"></input> </p> </div> <script> window.onload=function(){ new Vue({ el:'#app', data:{ msg:'hello vue' }, filters:{ // 碼值表 }, methods:{ keyEnter:function(){ console.log("Enter"); }, once:function(){ // 簽到 一天點選一次 console.log("once"); }, hander:function(){ alert(this.msg) } } }); } </script> </body> </html>