详解.vue文件中监听input输入事件(oninput)


Posted in Javascript onSeptember 19, 2017

.vue文件其实是一个组件,关于它的说明我之前也写过一篇文章,地址:.vue文件,今天这篇文章要讲的是.vue文件中监听input的输入值变化事件。需求是这页面中,改变input的值,就调用一个事件,第一想到的是oninput。

oninput 事件在用户输入时触发,菜鸟教程中的用法是:

详解.vue文件中监听input输入事件(oninput)

但是在.vue中这样写是没有作用的:

详解.vue文件中监听input输入事件(oninput)

<input type="text" id="cardsNum2" value="1" @oninput ="inputFunc">

这样写也没有作用:

详解.vue文件中监听input输入事件(oninput)

<input type="text" id="cardsNum2" value="1" v-on:oninput ="inputFunc">

最后,这样写才起作用:

详解.vue文件中监听input输入事件(oninput)

<input type="text" id="cardsNum2" value="1" v-on:input ="inputFunc">

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 写的一个简单的timer
Jul 30 Javascript
JS自定义功能函数实现动态添加网址参数修改网址参数值
Aug 02 Javascript
Jquery ajaxStart()与ajaxStop()方法(实例讲解)
Dec 18 Javascript
js 连续赋值的简单实现
Jun 13 Javascript
Bootstrap页面缩小变形的快速解决办法
Feb 03 Javascript
学习使用jQuery表单验证插件和日历插件
Feb 13 Javascript
angular.fromJson与toJson方法用法示例
May 17 Javascript
javascript实现延时显示提示框效果
Jun 01 Javascript
基于EasyUI的基础之上实现树形功能菜单
Jun 28 Javascript
详解vue-cli 构建项目 vue-cli请求后台接口 vue-cli使用axios、sass、swiper
May 28 Javascript
vue实现计算器功能
Feb 22 Javascript
Vue 数据响应式相关总结
Jan 28 Vue.js
JavaScript数组去重的多种方法(四种)
Sep 19 #Javascript
一步步教你利用Canvas对图片进行处理
Sep 19 #Javascript
vue2.0开发入门笔记之.vue文件的生成和使用
Sep 19 #Javascript
js实现QQ面板拖拽效果(慕课网DOM事件探秘)(全)
Sep 19 #Javascript
ECMAScript6变量的解构赋值实例详解
Sep 19 #Javascript
vue 粒子特效的示例代码
Sep 19 #Javascript
jQuery实现简单日期格式化功能示例
Sep 19 #jQuery
You might like
PHP简单系统数据添加以及数据删除模块源文件下载
2008/06/07 PHP
php 信息采集程序代码
2009/03/17 PHP
php实现将数组转换为XML的方法
2015/03/09 PHP
php 流程控制switch的简单实例
2016/06/07 PHP
thinkPHP框架RBAC实现原理分析
2019/02/01 PHP
asp.net HttpHandler实现图片防盗链
2009/11/09 Javascript
jquery下动态显示jqGrid以及jqGrid的属性设置容易出现问题的解决方法
2010/10/22 Javascript
javascript使用shift+click实现选择和反选checkbox的方法
2015/05/04 Javascript
Extjs实现下拉菜单效果
2016/04/01 Javascript
jQuery绑定事件-多种实现方式总结
2016/05/09 Javascript
jQuery中 $ 符号的冲突问题及解决方案
2016/11/04 Javascript
浅析webpack 如何优雅的使用tree-shaking(摇树优化)
2017/08/16 Javascript
javaScript日期工具类DateUtils详解
2017/12/08 Javascript
支付宝小程序自定义弹窗dialog插件的实现代码
2018/11/30 Javascript
ES6的Fetch异步请求的实现方法
2018/12/07 Javascript
angularjs http与后台交互的实现示例
2018/12/21 Javascript
JS实现指定区域的全屏显示功能示例
2019/04/25 Javascript
JavaScript实现图片上传并预览并提交ajax
2019/09/30 Javascript
vue改变循环遍历后的数据实例
2019/11/07 Javascript
Node.js API详解之 dns模块用法实例分析
2020/05/15 Javascript
Python的lambda匿名函数的简单介绍
2013/04/25 Python
如何在Python函数执行前后增加额外的行为
2016/10/20 Python
Django页面数据的缓存与使用的具体方法
2019/04/23 Python
python 判断字符串中是否含有汉字或非汉字的实例
2019/07/15 Python
Python3 filecmp模块测试比较文件原理解析
2020/03/23 Python
Tensorflow tf.nn.atrous_conv2d如何实现空洞卷积的
2020/04/20 Python
基于Python实现简单学生管理系统
2020/07/24 Python
利用CSS3实现单选框动画特效示例代码
2016/09/26 HTML / CSS
德国2018年度最佳在线药房:Bodfeld Apotheke
2019/11/04 全球购物
Linux如何修改文件和文件夹的权限
2013/09/05 面试题
护理专业个人求职简历的自我评价
2013/10/13 职场文书
求职推荐信
2013/10/28 职场文书
法律系毕业生自荐信范文
2014/03/27 职场文书
品牌推广策划方案
2014/05/28 职场文书
社区学习党的群众路线教育实践活动心得体会
2014/11/03 职场文书
承诺保证书格式
2015/02/28 职场文书