之前vue1.0的过滤器真的很好使,但是作者为了不让搬运工变得太菜。硬是砍去了过滤器,为此,我还哭了好一阵,终于,一点一点的弄明白了过滤器是怎么回事后,也学明白了vue里的属性监听器computed以及框架里提供的filter的使用,觉得,作者这样做是对的。

先来一个模糊搜索

 <ul>
<li v-for="user in newUsers" >
{{ user.code }}
</li>
</ul> new Vue({
el: '.app',
data: {
name: '',
users: [
{ code: '11111' },
{ code: '8797979' },
{ code: '4565465' },
{ code: '555555' },
{ code: '1006' },
{ code: '2555' },
] },
computed: {
newUsers: function () {
var that = this;
return that.users.filter(function (user) {
return user.code.toLowerCase().indexOf(that.code.toLowerCase()) !== -1;//当然如果是纯属字就可以不用转换小写了,处于习惯还是加上了
})
}
} })

  接下来还有一个select的,其实官网有例子,但是我还是毫无保留的拿出来了。

 <select v-model="selected" >
<option v-for="option in options" v-bind:value="option">
{{ option }}
</option>
</select>
<span>Selected: {{ selected }}</span> new Vue({
el: '.app',
data: {
selected: '30',
options: [
30,50,70,100
]
},
})

  

vue模糊搜索&select取值的更多相关文章

  1. jquery select取值,赋值操作

    select">jquery select取值,赋值操作 一.获取Select 获取select 选中的 text : $("#ddlRegType").find( ...

  2. jQuery radio取值,checkbox取值,select取值

    语法解释: $("#select_id").change(function(){//code...}); //为Select添加事件,当选择其中一项时触发 var checkTex ...

  3. easyui 》 radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中

    获取一组radio被选中项的值var item = $('input[@name=items][@checked]').val();获取select被选中项的文本var item = $(" ...

  4. jquery操作select(取值,设置选中)

    最近工作中总出现select 和 option问题,整理一下,内容大部分源于网络资料 一.基础取值问题 例如<select class="selector"></ ...

  5. jquery radio取值,checkbox取值,select取值及选中

    jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关 获取一组radio被选中项的值 var item = $('in ...

  6. jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中

    jQuery获取Select选择的Text和Value: 语法解释: 1. $("#select_id").change(function(){//code...}); //为Se ...

  7. Jquery常用操作:checkbox、select取值,radio、checkbox、select选中及其相关

    常用Jquery操作:checkbox取值.select取值.radio选中.checkbox选中.select选中及其相关: 1.影藏页面元素 使用jquery真的很方便,比如要控制div的显示与隐 ...

  8. jquery操作select(取值,设置选中) 基础

    每一次操作select的时候,总是要出来翻一下资料,不如自己总结一下,以后就翻这里了. 比如<select class="selector"></select&g ...

  9. select取值问题

    全栈攻城狮们给挖了各种坑..其中一个典型是select控件取值.直接上代码: <!DOCTYPE html> <html lang="en"> <he ...

随机推荐

  1. iOS AFNetworking 2.6.0框架导入报错解决方法

    最近手动导入AFNetworking 2.6.0框架时发现Xcode报如下3个错误: 1. Use of undeclared identifier ‘kSecFormatUnknown‘ 2. Us ...

  2. bzoj 4206 最大团 几何+lis

    最大团 Time Limit: 10 Sec  Memory Limit: 256 MBSubmit: 142  Solved: 65[Submit][Status][Discuss] Descrip ...

  3. C#学习目录处理

    目录获取和处理: string path = ".";//表明要在当前所在的目录 //先定义目录信息变量 DirectoryInfo dir = new DirectoryInfo ...

  4. Mybatis中传入List条件

    传入一个map的参数,map里有一个tenantIds的List,在xml里先判断这个List的size是否大于o,然后通过foreach 构造一个in后面括号里的元素,具体的xml如下: <i ...

  5. JSP动态合并单元格

    <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> <table ...

  6. 「6月雅礼集训 2017 Day10」perm(CodeForces 698F)

    [题目大意] 给出一个$n$个数的序列$\{a_n\}$,其中有些地方的数为0,要求你把这个序列填成一个1到$n$的排列,使得: $(a_i, a_j) = 1$,当且仅当$(i, j) = 1$.多 ...

  7. MSSQL备份脚本

    ) ) ) ),),':',''),' ',''),'-',''),'.','') set @name=N'DEMO'+@temp+'-完整 数据库 备份' set @disk=N'F:\Backup ...

  8. 【HNOI】 期望面积

    [题目描述]给定n个点,求这n个点组成凸包的期望面积.保证任意三点不共线. [数据范围]n<=100. 首先我们知道凸包面积的计算为所有在凸包上相邻的点的叉积和,那么我们可以枚举两个点,然后求出 ...

  9. 跨域iframe高度计算

    一.同域获取iframe内容 这里有两个细节: 1. 取iframe内的文档对象,标准浏览器使用contentDocument属性,IE低版本(IE6,7,8)使用document属性. 2. cal ...

  10. Windows下基于python3使用word2vec训练中文维基百科语料(二)

    在上一篇对中文维基百科语料处理将其转换成.txt的文本文档的基础上,我们要将为文本转换成向量,首先都要对文本进行预处理 步骤四:由于得到的中文维基百科中有许多繁体字,所以我们现在就是将繁体字转换成简体 ...