vue键盘事件:@keyup.down下方向键绑定事件
2023-09-14 09:01:59 时间
@keyup.13 回车
@keyup.enter 回车
@keyup.left 左键
@keyup.right 右键
@keyup.up 上键
@keyup.down 下键
@keyup.delete 删除键
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
</style>
</head>
<body>
<div id="app">
<p >{{a}}</p>
<!-- @keyup.down对应的是下方向键 -->
<input type="text" @keyup.down='add'>
</div>
<script src="js/vue.js"></script>
<script>
var vue = new Vue({
el:"#app",
data:{
a: 100
},
methods:{
add(event) {
console.log(event)
this.a ++
console.log(this.a)
}
}
})
</script>
</body>
</html>
相关文章
- Vue-cli的打包初体验
- Vue less使用scope时渗入修改子组件样式
- vue框架,数据展示和分析,报告管理界面
- [Vue + TS] Use Properties in Vue Components Using @Prop Decorator with TypeScript
- vue.js3:用mitt发送接收事件消息(vue@3.2.6 / mitt@3.0.0)
- Vue自定义组件插入值
- vue 前端解决跨域问题,
- vue.js3: 用axios访问接口(vue@3.2.37 / axios@0.27.2)
- vue事件修饰符:通过@click.self的self属性来阻止内层向外层冒泡
- Atitit mvc之道 attilax著 以vue为例 1. Atitti vue的几大概念1 1.1. 声明式渲染1 1.2. 条件与循环2 1.3. 处理用户输入 click事件2 1
- 134:vue+openlayers 编辑事件modifystart和modifyend(示例代码)
- 059:vue+openlayers点击选择feature,并设置特定的颜色(示例代码)
- 事件监听 & 页面滚动(页面滚动到某一位置时显示/隐藏某元素,Vue环境)
- vue-router学习地址