详解.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学习笔记(十七) 检测浏览器插件代码
Jun 20 Javascript
Js(JavaScript)中,弹出是或否的选择框示例(confirm用法的实例分析)
Jul 09 Javascript
jQuery截取指定长度字符串代码
Aug 21 Javascript
原生JS和jQuery版实现文件上传功能
Apr 18 Javascript
深入理解JS中的substr和substring
Apr 26 Javascript
jquery对象与DOM对象转化
Feb 08 Javascript
vue左右侧联动滚动的实现代码
Jun 06 Javascript
vue中v-model的应用及使用详解
Jun 27 Javascript
JS实现提示框跟随鼠标移动
Aug 27 Javascript
Vue两个版本的区别和使用方法(更深层次了解)
Feb 16 Javascript
js中!和!!的区别与用法
May 09 Javascript
js前端图片加载异常兜底方案
Jun 21 Javascript
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 快速生成 Flash 动画的方法
2007/03/06 PHP
php mysql数据库操作类
2008/06/04 PHP
php中根据变量的类型 选择echo或dump
2012/07/05 PHP
PHP测试成功的邮件发送案例
2015/10/26 PHP
如何使用微信公众平台开发模式实现多客服
2016/01/06 PHP
使用laravel指定日志文件记录任意日志
2019/10/17 PHP
用js统计用户下载网页所需时间的脚本
2008/10/15 Javascript
动态表格Table类的实现
2009/08/26 Javascript
用jquery实现下拉菜单效果的代码
2010/07/25 Javascript
让浏览器非阻塞加载javascript的几种方法小结
2011/04/25 Javascript
hover的用法及live的用法介绍(鼠标悬停效果)
2013/03/29 Javascript
ECMAScript6的新特性箭头函数(Arrow Function)详细介绍
2014/06/07 Javascript
html文本框提示效果的示例代码
2014/06/28 Javascript
js实现数字每三位加逗号的方法
2015/02/05 Javascript
jQuery 遍历函数详解
2015/07/05 Javascript
JQuery实现列表中复选框全选反选功能封装(推荐)
2016/11/24 Javascript
jquery封装插件时匿名函数形参和实参的写法解释
2017/02/14 Javascript
JS排序算法之冒泡排序,选择排序与插入排序实例分析
2017/12/13 Javascript
vue基于mint-ui实现城市选择三级联动
2020/06/30 Javascript
在 Vue 项目中引入 tinymce 富文本编辑器的完整代码
2018/05/04 Javascript
微信小程序的mpvue框架快速上手指南
2019/05/15 Javascript
在Django的URLconf中进行函数导入的方法
2015/07/18 Python
Python中使用Queue和Condition进行线程同步的方法
2016/01/19 Python
python如何查看系统网络流量的信息
2016/09/12 Python
python快速建立超简单的web服务器的实现方法
2018/02/17 Python
Python对CSV、Excel、txt、dat文件的处理
2018/09/18 Python
python2和python3的输入和输出区别介绍
2018/11/20 Python
Python实现高斯函数的三维显示方法
2018/12/29 Python
使用Python进行体育竞技分析(预测球队成绩)
2019/05/16 Python
postman传递当前时间戳实例详解
2019/09/14 Python
python之pygame模块实现飞机大战完整代码
2020/11/29 Python
教师职称自我鉴定
2014/02/12 职场文书
小学毕业寄语大全
2014/04/03 职场文书
个人自查自纠材料
2014/10/14 职场文书
2014年护理工作总结范文
2014/11/14 职场文书
PostgreSQL通过oracle_fdw访问Oracle数据的实现步骤
2021/05/21 PostgreSQL