默认再每个input上加 keyup.enter 是可以绑定事件的 可是多个input一起绑定同一个事件就比较麻烦 所以就在vue dom里面遍历查找并绑定事件

let handleEnter = (obj, handle) => {
if(!obj){
return;
}
if (!obj.$options) {
return;
}
//因为使用的是iView的组件 所以判断绑定的是Input 和 handleEnter
//如果使用默认的input 则是判断 INPUT 和 keyup
if (obj.$options._componentTag == "Input") {
obj.handleEnter = handle;
return;
}
//如果使用默认的input 这里遍历的是obj.$el.children
if (obj.$children.length == 0) {
return;
}
obj.$children.map(item => {
handleEnter(item, handle);
}) }

  这里需要区分的是组件或者是input标签 因为我只使用了组件Input所以没有区分 如果使用的是input则是跟普通DOM一样遍历 后面不做赘述

  

vue中多个input绑定enter按键事件的更多相关文章

  1. vue中的数据双向绑定

    学习的过程是漫长的,只有坚持不懈才能到达到自己的目标. 1.vue中数据的双向绑定采用的时候,数据劫持的模式.其实主要是用了Es5中的Object.defineProperty;来劫持每个属性的get ...

  2. Vue中如何监听组件的原生事件

    在首页开发中,右下角有一个返回顶部的小箭头,将它单独封装成一个BackTop组件,但是它何时出现需要依赖于首页的滑动,即另外一个Scroll组件.如果直接在BackTop组件里面监听,则需要通过thi ...

  3. Vue循环中多个input绑定指定v-model

    Vue.js中提供了v-model可以双向绑定表单元素,这个方法可以非常方便的获得输入的值,但是有时候表单元素需要循环生成,在循环中要怎样获得指定输入框的值呢 这里介绍两种,一种是v-for中循环生成 ...

  4. Vue中自动获取input焦点

    <input v-focus type="text" name="search" ref="input" autofocus v-mo ...

  5. vue中v-model 数据双向绑定

    表单输入绑定 v-model 数据双向绑定,只能应用在input /textare /select <div id="app"> <input type=&quo ...

  6. Vue中class与style绑定

    gitHub地址:https://github.com/lily1010/vue_learn/tree/master/lesson07 一 用对象的方法绑定class 很简单,举个栗子: <!D ...

  7. vue中html模板使用绑定的全局函数

    我们知道在script中使用vue绑定的全局函数时, 我们需要用这种方式使用: this.Util.Fun(e) 那在模板中, 比如v-if中想使用Fun函数怎么办呢?你应该这样做 <i v-i ...

  8. 纯小白入手 vue3.0 CLI - 2.3 - 组件 home.vue 中学习指令和绑定

    vue3.0 CLI 真小白一步一步入手全教程系列:https://www.cnblogs.com/ndos/category/1295752.html 我的 github 地址 - vue3.0St ...

  9. vue中时间控件绑定多个输入框

    首先去下载laydate时间控件,引入到相应的模板中 <input type="text" val-required="" value="&qu ...

随机推荐

  1. 学习笔记-nodejs报错

    端口被占用 解决办法:打开控制管理器关掉node.exe进程 如果找不到可以使用命令行:netstat -ano | findstr 8000 找到进程的pid,然后到控制管理器找到进程杀掉. net ...

  2. 【Java学习笔记之二】java标识符命名规范

    什么是标识符 就是程序员在定义java程序时,自定义的一些名字.标识符可以应用在类名.变量.函数名.包名上. 标识符必须遵循以下规则 标识符由26个英文字符大小写(a~zA~Z).数字(0~9).下划 ...

  3. 数位DP入门:(bzoj1833+3209)

    //我是来看文章创建时间的= = 膜拜了一下蔡大神.... 人生第一道自己写的数位DP...好吧以前是看题解然后也不知道为什么就过了的>_< 虽然说现在还是只会裸题= = 数位DP介绍: ...

  4. hdu_1018(斯大林公式/n!的位数)

    题意:求大数n!的位数. 根据n! = (int)log(n!)+1 方法1: log(n!) = log(1*2*3*...*n) = log1+log2+...+logn 方法2: 斯大林公式: ...

  5. ACM_高次同余方程

    /*poj 3243 *解决高次同余方程的应用,已知 X^Y = K mod Z, 及X,Z,K的值,求 Y 的值 */ #include<cstdio> #include<cstr ...

  6. Visual Studio 2017 安装后无法创建c++或MFC项目

    话话不多说,直接上图

  7. c+(内存)

    内存是程序运行的基础.所有正在运行的代码都保存在内存里面.内存需要处理各种各样的数据,包括键盘的数据.鼠标的数据.usb的数据.串口的数据.摄像头的数据,那么这些数据经过程序的处理之后,就要进行输出到 ...

  8. Django App(二) Connect Mysql & defualt App admin

    这一篇接着上一篇polls App自动创建admin app.     1.安装数据库 这里的内容从官网看越看越像 EntityFramework的内容.Python支持SQLite,MySql,Or ...

  9. JavaScript八张思维导图—字符串用法

    JS基本概念 JS操作符 JS基本语句 JS数组用法 Date用法 JS字符串用法 JS编程风格 JS编程实践 不知不觉做前端已经五年多了,无论是从最初的jQuery还是现在火热的Angular,Vu ...

  10. 织梦dede在首页调用留言本

    织梦dedecms在首页调用留言本 . {dede:loop table=dede_guestbook sort=dtime row=10 titlelen=36 typeid=40 if=ische ...