vue 过滤与全文索引
过滤 与 全文索引

<template>
<div>
<input type="text" v-model="query">
<ul>
<li v-for="(item, index) in computedList">
{{ item.msg }}
</li>
</ul>
</div>
</template> <script>
export default {
data () {
return {
query: '',
list: [
{ msg: 'Bruce Lee' },
{ msg: 'Jackie Chan' },
{ msg: 'Chuck Norris' },
{ msg: 'Jet Li' },
{ msg: 'Kung Fury' }
]
}
},
computed: {
computedList: function () {
var vm = this
return this.list.filter(function (item) {
return item.msg.toLowerCase().indexOf(vm.query.toLowerCase()) !== -1
})
}
}
}
</script>
vue 过滤与全文索引的更多相关文章
- vue过滤数字为2位小数点,过滤器
过滤数字为2位小数点 filters: { //保留2位小数点过滤器 不四舍五入 number(value) { var toFixedNum = Number(value).toFixed(3); ...
- vue过滤动画
一.使用<transition name="fade"></transition>标签 name="fade", 是创建个fade的类名 ...
- vue 过滤
- vue过滤金额自动补全小数点
watch:{ //监听input双向绑定 balance(value) { //保留2位小数点过滤器 不四舍五入 var toFixedNum = Number(value).toFixed(3); ...
- Vue#表单控件绑定
使用v-model 在表单控件上实现数据双向绑定. 单选:https://jsfiddle.net/miloer/bs49p0fx/ <input type="checkbox&quo ...
- vue新手入门指导,一篇让你学会vue技术栈,本人初学时候的文档
今天整理文档突然发现了一份md文档,打开一看 瞬间想起当年学习vue的艰难路,没人指导全靠自己蒙,下面就是md文档内容,需要的小伙伴可以打开个在线的md编译器看一看,我相信不管是新人还是老人 入门总 ...
- 高效开发 Web 单页应用解决方案
于 2017 年初,有在 Github 建立并维护一个项目:Vue Boilerplate Template,欲成就一款开箱即用 Vue + Webpack 的脚手架模版:其目标与宗旨是:根据以往经验 ...
- Vue数组更新及过滤排序
前面的话 Vue为了增加列表渲染的功能,增加了一组观察数组的方法,而且可以显示一个数组的过滤或排序的副本.本文将详细介绍Vue数组更新及过滤排序 变异方法 Vue 包含一组观察数组的变异方法,它们将会 ...
- Vue.js示例:GitHub提交(watch数据,created钩子,filters过滤); 网格组件(功能:1.检索,2排序);
GitHub提交 codePen: https://codepen.io/chentianwei411/pen/wEVPZo 注意:频繁看案例,可能会被限制. 重点: 表单输入绑定, 单选按钮的使 ...
随机推荐
- python编码问题 与 代码换行问题
转载请注明: 仰望高端玩家的小清新 http://www.cnblogs.com/luruiyuan/ python程序对于unicode码的支持情况不同 python3 支持较好,在文件开头加入如下 ...
- P2819 图的m着色问题
题目背景 给定无向连通图G和m种不同的颜色.用这些颜色为图G的各顶点着色,每个顶点着一种颜色.如果有一种着色法使G中每条边的2个顶点着不同颜色,则称这个图是m可着色的.图的m着色问题是对于给定图G和m ...
- 第3天-DIV+CSS布局
盒子模型 margin 设置外边距宽度 有4个值的时候: maigin 10px 5px 15px 20px; (上.右.下.左)有3个值的时候: margin: 10px 5px 15px; (上. ...
- RPD Volume 172 Issue 1-3 December 2016 评论02
Introduction to the special issue of Radiation Protection Dosimetry This special issue is a collecti ...
- ZOJ 3949 Edge to the Root(树形DP)
[题目链接] http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=3949 [题目大意] 给出一棵根为1的树,每条边边长为1,请你 ...
- [CF607D]Power Tree
题目大意: 一棵树初始只有一个编号为$1$的权值为$w_1$的根.$q(q\le2\times10^5)$次操作,每次可以给出$v,w(w<10^9)$,新建一个结点作为$v$的子结点,权值为$ ...
- Idea下Android的配置
(1) 下载安装好Intellij Idea和Android SDK. (2) Android SDK设置 ,在FIle –> Other Settings –> Default Proj ...
- docker 实现redis集群搭建
摘要:接触docker以来,似乎养成了一种习惯,安装什么应用软件都想往docker方向做,今天就想来尝试下使用docker搭建redis集群. 首先,我们需要理论知识:Redis Cluster是Re ...
- List<实体>与List<String>数据互转
1.List<实体>数据: public List<Device> queryOSDevice(String cpu,String ip,String name){ Strin ...
- (转)MFC的GUI窗口使用Console输出函数printf
原文链接 在GUI程序中使用printf函数: #include <io.h> #include <fcntl.h> void InitConsole() { ; FILE* ...