按键修饰符
通过v-on的方式绑定键盘事件,键盘事件类型:
keydown 键盘按下(如果按住不放,不停的重复触发)
keyup 键盘抬起
keypress 键盘按下(只支持字符键)
实现输入密码后,enter提交,在控制台输出:
<input type="text" v-model="passwordName" v-on:keyup.enter="handle"/>
案例分享:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<script src="vue.js"></script>
</head>
<body>
<div id="app">
<div>
用户名:<input type="text" v-model="uname"/>
</div>
<div>
密 码:<input type="text" v-model="passwordName" v-on:keyup.enter="handle"/>
</div>
<div>
<input type="button" value="提交" v-on:click="handle"/>
<input type="button" value="清空" v-on:click="handle1"/>
</div>
</div>
<script type="text/javascript">
var vm = new Vue({
el:"#app",
data:{
uname:"",
passwordName:""
},
methods:{
handle:function(){
console.log(this.uname+" "+this.passwordName)
},
handle1:function(){
this.uname = '';
this.passwordName = '';
}
}
})
</script>
</body>
</html>