Vue2.0实现1.0的搜索过滤器功能实例代码
作者：姜瑞涛 发布时间：2024-05-09 10:40:30
标签：vue,搜索
Vue2.0删除了很多1.0的比较实用的过滤器，如filterBy，orderBy。官方文档给了通过计算属性实现1.0搜索过滤器功能，自己又加入了大小写通用检索功能，比较简单，学一下。
<body>
<div class="app">
<input type="text" v-model="name">
<ul>
<li v-for="user in newUsers" >
{{ user.name }}
</li>
</ul>
</div>
<script>
new Vue({
el: '.app',
data: {
name: '',
users: [
{ name: 'Bruce' },
{ name: 'Chuck' },
{ name: 'Jackie' },
{ name: '赵' }
]
},
computed: {
newUsers: function () {
var that = this;
return that.users.filter(function (user) {
return user.name.toLowerCase().indexOf(that.name.toLowerCase()) !== -1;
})
}
}
})
</script>
</body>
来源：http://www.cnblogs.com/zhansu/p/6118793.html
0
投稿猜你喜欢
- 一、导入库import randomimport time二、注册用户我们用变量与input实现name = str(input('
- 无法打开用户默认数据库，登录失败,这也是SQL Server使用者熟悉的问题之一。在使用企业管理器、查询分析器、各类工具和应用软件的时候，只
- 外联接。外联接可以是左向外联接、右向外联接或完整外部联接。 在 FROM 子句中指定外联接时，可以由下列几组关键字中的一组指定：LEFT J
- Python使用Try Exception来处理异常机制 若Exception中有Try对应的异常处理，则Try - exception之后
- 本文实例讲述了python实现在sqlite动态创建表的方法。分享给大家供大家参考。具体实现方法如下：import sqlite3 as d
一、matplotlib 库一个用来绘图的库import matplotlib.pyplot as plt1）plt.imread(&- 简介特点请求你所要的数据，不多不少获取多个资源，只用一个请求描述所有的可能，类型系统几乎所有语言支持文档Graphene-PythonGra
- 本文实例讲述了python异常处理用法。分享给大家供大家参考，具体如下：之前用Java的时候，在容易出错的地方我们经常使用try…catch
- 1 K-means算法实际上，无论是从算法思想，还是具体实现上，K-means算法是一种很简单的算法。它属于无监督分类，通过按照一定的方式度
- mysql数据库数据表和数据表关联--问题??用户数据表user 字词作品数据表article 短信 message外键ID 主键，之间的关
- 本文实例主要实现的是使用urllib和BeautifulSoup爬取 * 的词条，具体如下。简洁代码：#引入开发包from urllib.
- 什么是Flask？Flask是一个用Python编写的Web应用程序框架，Flask是python的web框架，最大的特征是轻便，让开发者自
- 项目地址是：https://www.chenshiyang.com/dytk接下来我们分析下源码简要看下实现原理。实现原理该项目不需要使用模
- 关于Java和Mysql 8.0.18版本的连接方式，供大家参考，具体内容如下1.官网下载mysql-server.（Connector/J
- 前言PyTorch是一个开源的深度学习框架，基础教学从开始安装学起，一步一个脚印。提示：以下是本篇文章正文内容，下面案例可供参考一、Pyor
- 这个python的小案例是五子棋游戏的实现，在这个案例中，我们可以实现五子棋游戏的两个玩家在指定的位置落子，画出落子后的棋盘，并且根据函数判
- 为什么Python中0.2+0.1不等于0.3大家请看下面的python程序代码：print(0.2+0.1)猜一猜运行结果是什么，是0.3
- 一般不建议做第4,6两步，第4步不安全,有可能损坏数据库或丢失数据。第6步如果日志达到上限,则以后的数据库处理会失败,在清理日志后才能恢复。
- 本文实例讲述了Python数据结构之图的应用。分享给大家供大家参考，具体如下：一、图的结构二、代码# -*- coding:utf-8 -*
- 目录1.python中的异常2.捕捉异常try-except多个except子句 一个except块捕捉多个异常 空ex
