vue系统修饰符:@click.ctrl.exact CTRL键
2023-09-14 09:01:59 时间
<!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>
<button @click.ctrl.exact='add'>按我加1 </button>
</div>
<script src="js/vue.js"></script>
<script>
var vue = new Vue({
el:"#app",
data:{
a: 100
},
methods:{
add() {
this.a ++
console.log(this.a)
}
}
})
</script>
</body>
</html>
请注意修饰键与常规按键不同,在和 keyup 事件一起用时,事件触发时修饰键必须处于按下状态。换句话说,只有在按住 ctrl的情况下释放其它按键,才能触发 keyup.ctrl。而单单释放 ctrl 也不会触发事件。如果你想要这样的行为,请为 ctrl 换用keyCode:keyup.17。
相关文章
- 那些年曾经没回答上来的vue面试题
- Vue 滚动条定位问题
- Vue快速入门
- Vue(27)vue-codemirror实现在线代码编译器「建议收藏」
- vue项目性能优化-前端加分项
- 关于vue-admin-work后台前端管理框架重大升级
- 能被“阿里爸爸”吹爆的SpringBoot+Vue全栈发手册到底多绝绝子?
- vue 正则表达式验证_vue表单自定义验证
- vue单页应用和多页应用_多页面应用需要vuejs吗
- vue 中路径props的传参
- Vue响应式系统原理
- Vue-cli搭建的项目中路径别名的配置
- vue父子组件的生命周期顺序
- Java和vue开发的橱柜定制系统家具定制系统
- java和vue的学生健康管理系统疫情打卡系统
- vue.js客服系统实时聊天项目开发(五)flex布局实现输入框区域
- Vue 全家桶介绍
- vue.js客服系统实时聊天项目开发(十九)使用正则将消息格式替换为产品卡片信息
- vue.js客服系统实时聊天项目开发(二十一)vue项目中引入静态资源
- Vue使用ECharts做图表
- Vue的Eslint报错‘res‘ is defined but never used
- vue-cli3项目搭建配置以及性能优化
- Vue框架搭建在Redis之上的Web应用(vue请求redis)
- Vue实时监测Redis变化(vue监控redis变化)
- Vue搭配Redis做针对性取值(vue redis取值)