<input id="materialSearch" type="text" @keyup.enter="search" @input="search($event)"/>

这里的重点是:@input="search($event)",表示当文本框有内容输入时,则调用search方法

/*模糊搜索*/
search: function (event) {
//方法一:直接通过event.data可以获得文本内容
if(event.data!=null){
this.materialName = event.data;
}
//方法二:获取DOM对象取value值
this.materialName = event.currentTarget.value;
//方法三:通过js获取
this.materialName = document.getElementById("materialSearch").value;
}

vue监听input标签的value值方法的更多相关文章

  1. jQuery封装自定义事件--valuechange(动态的监听input,textarea)之前值,之后值的变化

    jQuery封装自定义事件--valuechange(动态的监听input,textarea)之前值,之后值的变化 js监听输入框值的即时变化 网上有很多关于 onpropertychange.oni ...

  2. 微信小程序监听input输入并取值

    小程序的事件分为两种,冒泡和非冒泡事件,像<form/>的submit事件,<input/>的input事件,<scroll-view/>的scroll事件等非冒泡 ...

  3. 实时监听input标签输入 实时监听文本框输入 避免中文输入法无法触发onkeyup事件的问题

    前言: 对于实时监听输入,这种需求大多数都是用于一个联想字提醒,智能提醒.大家都知道onkeydown,onkeypress,onkeyup的在监听中文输入法或者右键粘贴的时候都存在一些弊端,不是那么 ...

  4. 监听<input/>标签行为的方法总结

    一.内容改变 1.<input onchange="javascript:function()"/>方法 onchange可以替换为下面几种:oninput,onpro ...

  5. js无法监听input中js改变值的变化

    $(input).on('change',function(){ }) 当使用$(input).val('...');不会触发它的change事件 解决办法一:在改变它的值后,手动触发input的ch ...

  6. jQuery -- 监听input、textarea输入框值变化

    $('textarea').bind('input propertychange', function(){ if($(".textareachange").val() != &q ...

  7. valuechange(动态的监听input,textarea)

    valuechange(动态的监听input,textarea)之前值,之后值的变化 jQuery封装自定义事件--valuechange(动态的监听input,textarea)之前值,之后值的变化 ...

  8. 原生js监听input值发生变化

    原生JS中可以使用oninput,onpropertychange,onchange oninput,onpropertychange,onchange的用法 1) onchange 触发事件必须满足 ...

  9. js 实时监听input中值变化

    注意:用到了jquery需要引入jquery.min.js. 需求: 1.每个地方需要分别打分,总分为100; 2.第一个打分总分为40; 3.第二个打分总分为60. 注意:需要判断null.&quo ...

随机推荐

  1. 洛谷P3901 数列找不同(莫队)

    传送门 我不管我不管我就是要用莫队 直接用莫队裸上 //minamoto #include<iostream> #include<cstdio> #include<alg ...

  2. LVS+OSPF 架构(转)

    http://blog.51cto.com/pmghong/1399385 LVS 和 LVS+keepalived 这两种架构在平时听得多了,最近才接触到另外一个架构LVS+OSPF.这个架构实际上 ...

  3. atcoder 2579

    You are taking a computer-based examination. The examination consists of N questions, and the score ...

  4. vue学习二:

    vue的常用标签: 1.<router-link to=''>主要实现跳转链接功能,属性to='/'即是跳转到path为'/'的路径. 2.v-bind动态绑定指令,格式为:v-bind: ...

  5. linux 环境下tomcat中部署jfinal项目

    tomcat中部署jfinal项目 问题现象如下图 问题描述: 我在自己的windows7系统上tomcat下面跑这个项目没有任何问题吗,但是当我把项目上传到linux服务器上的tomcatwebap ...

  6. Kibana6.x.x——【Running "run:optimizeBuild" (run) task】出现警告信息

    Warning: non-zero exit code 64 Use --force to continue. 还未找到解决方法,先记录下来.

  7. Linq,拉姆达表达式注意!

    linq的条件语句尽量不要出现计算的式子,要不然很可能,程序不能正确的将这些复杂的式子编译成表达式!! 例如: dataContext.Assets.Count(s => s.SubCatego ...

  8. Educational Codeforces Round 7 A

    Description Consider the infinite sequence of integers: 1, 1, 2, 1, 2, 3, 1, 2, 3, 4, 1, 2, 3, 4, 5. ...

  9. Flask&&人工智能AI -- 7 MongoDB

    MongoDB初识,增删改查操作,数据类型,$关键字以及$修改器.“$”的奇妙用法,Array Object的特殊操作,选取跳过排序,客户端操作 一.MongoDB初识 什么是MongoDB Mong ...

  10. Observable Flowable Test

    package com.test.rxjava; import java.time.Duration; import java.time.Instant; import java.util.Linke ...