Vue-键盘事件

作者: linlu_home | 来源:发表于2019-02-22 17:11 被阅读0次

<!-- Vue-键盘事件及键值修饰符 -->

<DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>Vue.js</title>
    <link rel="stylesheet" href="style2.css">
    <script src="https://cdn.jsdelivr.net/npm/vue"></script>
</head>
<body>  
    <div id="vue-app">
        <h1>Event</h1>
        <label>姓名：</label>
        <input type="text" v-on:keyup.enter="logName"> <!--当前仅当按下enter时触发方法-->
        <label>年龄：</label>
        <input type="text" v-on:keyup.alt.enter="logAge"><!--当前仅当按下enter和alt时触发方法-->
        
    </div>

    <script src="app3.js"></script>
</body>
</html>

new Vue({
    el:"#vue-app",
    data:{

    },
    methods:{
        logName: function(){
            console.log("正在输入名字")
        },
        logAge: function(){
            console.log("正在输入年龄")
        },
    }
})