v-on 事件监听器

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><script type="text/javascript" src="../assets/js/vue.js"></script><title>v-on事件监听器</title>
</head>
<body>
<h1>v-on 事件监听器</h1>
<hr>
<div id="app">本场比赛得分： {{fenshu}} <br/><button v-on:click="jiafen">加分</button><button @click="jianfen">减分</button><br/><input type="text" v-on:keyup.enter="onEnter" v-model="fenshu2"></div><script type="text/javascript">var app=new Vue({el:'#app',data:{fenshu:1,fenshu2:1},methods:{jiafen:function(){this.fenshu++;},jianfen:function(){this.fenshu--;},onEnter:function(){this.fenshu=this.fenshu+parseInt(this.fenshu2);}}})
</script>
</body>
</html>

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

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

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

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

 js:onEnter:function(){this.fenshu=this.fenshu+parseInt(this.fenshu2);}

转载于:https://www.cnblogs.com/xu951128/p/7264018.html

v-on 事件监听器相关推荐

android监听器在哪里创建,[转载]android开发中创建按钮事件监听器的几种方法
第一种:匿名内部类作为事件监听器类 Button button=(Button) findViewById(R.id.button); button.setOnClickListener(new On ...
【IOC 控制反转】Android 事件依赖注入 ( 事件依赖注入具体的操作细节 | 创建事件监听器对应的动态代理 | 动态代理的数据准备 | 创建调用处理程序 | 创建动态代理实例对象 )
文章目录前言一.创建事件监听器对应的动态代理二.动态代理数据准备三.动态代理调用处理程序四.动态代理实例对象创建前言 Android 依赖注入的核心就是通过反射获取类 / 方 ...
android 控件监听方法,Android界面控件（2）—注册点击事件监听器
Button和ImageButton 1.添加控件 1.打开Android项目下,res文件夹中的 layout 的 activity_main.xml 文件 2.可视化界面拖拽添加或修改 xml 文 ...
Android学习之为按钮添加事件监听器的两种方法
为按钮(包括普通按钮和图片按钮等)添加单击事件监听器有两种方法,第一种是利用匿名内部类来实现,第二种是使用onClick属性来实现 1.匿名内部类使用匿名内部类,我们首先需要在布局文件中给按钮设置i ...
基于Java的Minecraft游戏后端自定义插件 05事件监听器
事件监听器内容简介事件监听器内容简介事件监听器文档中org.bukkit.event都是事件包 https://www.youtube.com/watch?v=PWQNsqwD-AY. pu ...
Java基础之处理事件——实现低级事件监听器（Sketcher 2 implementing a low-level listener）...
控制台程序. 定义事件监听器的类必须实现监听器接口.所有的事件监听器接口都扩展了java.util.EventListener接口.这个接口没有声明任何方法,仅仅用于表示监听器对象.使用EventLi ...
【Android 事件分发】ItemTouchHelper 源码分析 ( OnItemTouchListener 事件监听器源码分析二 )
Android 事件分发系列文章目录 [Android 事件分发]事件分发源码分析 ( 驱动层通过中断传递事件 | WindowManagerService 向 View 层传递事件 ) [Andr ...
【Android 事件分发】ItemTouchHelper 源码分析 ( OnItemTouchListener 事件监听器源码分析 )
Android 事件分发系列文章目录 [Android 事件分发]事件分发源码分析 ( 驱动层通过中断传递事件 | WindowManagerService 向 View 层传递事件 ) [Andr ...
Android 事件与事件监听器
Android系统中常见的事件监听器有如下几种: 1.单击事件(View.OnClickListener):当用户触碰到某个组件或者方向键被按下时产生该事件,该事件的处理方法是onClick(). 2 ...
13、Java Swing事件监听：事件处理模型和事件监听器
事件表示程序和用户之间的交互,例如在文本框中输入,在列表框或组合框中选择,选中复选框和单选框,单击按钮等.事件处理表示程序对事件的响应,对用户的交互或者说对事件的处理是事件处理程序完成的. 当事件发生 ...

v-on 事件监听器

v-on 事件监听器相关推荐

最新文章

热门文章