v-on:绑定事件监听器

简介: v-on:绑定事件监听器

v-on 就是监听事件,可以用v-on指令监听DOM事件来触发一些javascript代码。

v-on 还有一种简单的写法,就是用@代替。

<button @click="jianfen">减分</button>


我们除了绑定click之外,我们还可以绑定其它事件,比如键盘回车事件v-on:keyup.enter,现在我们增加一个输入框,然后绑定回车事件,回车后把文本框里的值加到我们的count上。 绑定事件写法:

<input type="text" v-on:keyup.enter="onEnter" v-model="secondCount">


javascript代码:

onEnter:function(){
     this.count=this.count+parseInt(this.secondCount);
}


因为文本框的数字会默认转变成字符串,所以我们需要用parseInt()函数进行整数转换。

目录
相关文章
|
Java
25JavaWeb基础 - 监听器
25JavaWeb基础 - 监听器
60 1
|
20天前
|
JavaScript 前端开发
除了点击事件,`addEventListener` 还能用于处理哪些事件类型?
【10月更文挑战第29天】 `addEventListener` 能够处理的事件类型非常丰富,涵盖了各种用户交互和页面状态变化的场景,通过合理地使用这些事件类型,可以为网页或应用程序添加丰富多样的交互效果和功能。
|
20天前
|
JavaScript 前端开发
除了 `addEventListener` 方法,还有哪些方式可以为元素添加事件监听器?
【10月更文挑战第29天】虽然存在多种为元素添加事件监听器的方式,但 `addEventListener` 方法因其具有更好的兼容性、灵活性和可维护性,成为了现代JavaScript开发中添加事件监听器的首选方式。在实际项目中,应尽量使用 `addEventListener` 来实现事件绑定,以提高代码的质量和可维护性,并确保在不同浏览器中的一致性表现。
|
30天前
|
JavaScript 前端开发 索引
如何给组件的元素添加事件监听器?
在组件的元素上添加事件监听器,可以通过在元素上使用 `@事件名` 的语法来实现。例如,`@click=&quot;handleClick&quot;` 表示当元素被点击时,会触发 `handleClick` 方法。
|
3月前
|
JavaScript 前端开发
绑定事件的方法有几种?
绑定事件的方法有几种?
|
6月前
事件监听
事件监听
|
程序员
监听器
监听器
114 0
|
JavaScript API
js: 添加事件监听addEventListener、移除事件监听removeEventListener
js: 添加事件监听addEventListener、移除事件监听removeEventListener
140 0
|
XML 缓存 NoSQL
事件监听思考
在整合在项目中,我们通常需要基于事件去触发另外的业务逻辑动作的完成。也即在我们做需求时,通常会基于不同的事件码来完成业务处理,此时可以考虑将其单独处理,基于观察者模式+策略模式。还有一种如果当Spring完成Bean的初始化,需要做一些特殊处理,此时除了使用InitializingBean,还可以使用监听完成一些定制化的初始化动作,实现ApplicationListener<ContextRefreshedEvent>。
128 0
事件监听思考
|
JavaScript
click与addEventListener和removeEventListener事件详解
click与addEventListener和removeEventListener事件详解
click与addEventListener和removeEventListener事件详解