过滤 与 全文索引

<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 过滤与全文索引的更多相关文章

  1. vue过滤数字为2位小数点,过滤器

    过滤数字为2位小数点 filters: { //保留2位小数点过滤器 不四舍五入 number(value) { var toFixedNum = Number(value).toFixed(3); ...

  2. vue过滤动画

    一.使用<transition name="fade"></transition>标签 name="fade", 是创建个fade的类名 ...

  3. vue 过滤

  4. vue过滤金额自动补全小数点

    watch:{ //监听input双向绑定 balance(value) { //保留2位小数点过滤器 不四舍五入 var toFixedNum = Number(value).toFixed(3); ...

  5. Vue#表单控件绑定

    使用v-model 在表单控件上实现数据双向绑定. 单选:https://jsfiddle.net/miloer/bs49p0fx/ <input type="checkbox&quo ...

  6. vue新手入门指导,一篇让你学会vue技术栈,本人初学时候的文档

    今天整理文档突然发现了一份md文档,打开一看 瞬间想起当年学习vue的艰难路,没人指导全靠自己蒙,下面就是md文档内容,需要的小伙伴可以打开个在线的md编译器看一看,我相信不管是新人还是老人  入门总 ...

  7. 高效开发 Web 单页应用解决方案

    于 2017 年初,有在 Github 建立并维护一个项目:Vue Boilerplate Template,欲成就一款开箱即用 Vue + Webpack 的脚手架模版:其目标与宗旨是:根据以往经验 ...

  8. Vue数组更新及过滤排序

    前面的话 Vue为了增加列表渲染的功能,增加了一组观察数组的方法,而且可以显示一个数组的过滤或排序的副本.本文将详细介绍Vue数组更新及过滤排序 变异方法 Vue 包含一组观察数组的变异方法,它们将会 ...

  9. Vue.js示例:GitHub提交(watch数据,created钩子,filters过滤); 网格组件(功能:1.检索,2排序);

    GitHub提交 codePen:   https://codepen.io/chentianwei411/pen/wEVPZo 注意:频繁看案例,可能会被限制. 重点: 表单输入绑定, 单选按钮的使 ...

随机推荐

  1. ( 转 ) Mysql group_concat 的反向应用实现(Mysql列转行)

    用过Mysql的都知道她有一个很好的实现行转列功能的函数group_concat函数,非常方便 点击(此处)折叠或打开 SELECT * FROM group_test; SELECT id, GRO ...

  2. (转载)UIKIt力学教程

    转载自:http://www.cocoachina.com/ios/20131226/7614.html 这篇文章还可以在这里找到 英语,   Ray:这篇教程节选自 iOS 7 教程集,它是 iOS ...

  3. 【三分】Codeforces Round #403 (Div. 2, based on Technocup 2017 Finals) B. The Meeting Place Cannot Be Changed

    三分显然,要注意EPS必须设成1e-6,设得再小一点都会TLE……坑炸了 #include<cstdio> #include<algorithm> #include<cm ...

  4. [Hybrid App]--Android混合开发,Android、Js的交互

    AndroidJs通信 *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !imp ...

  5. 如何用JavaScript重定向到另一个网页?

    可以使用 window.location.replace() 方法重定向到另一个页面.相对于 window.location.href ,replace的优势是不会跳转记录并不会保留在历史会话中,这就 ...

  6. Ubuntu 16.04通过源码安装QUEM虚拟机

    下载编译安装: wget http://download.qemu-project.org/qemu-2.9.0.tar.xz tar xvJf qemu-2.9.0.tar.xz cd qemu-2 ...

  7. 直接拿来用!最火的iOS开源项目(二)

    每一次的改变总意味着新的开始.”这句话用在iOS上可谓是再合适不过的了.GitHub上的iOS开源项目数不胜数,iOS每一次的改变,总会引发iOS开源项目的演变,从iOS 1.x到如今的iOS 7,有 ...

  8. WebService authentication

    http://blog.csdn.net/largestone_187/article/details/5734632 通过SoapHeader对用户口令进行验证,只有授权的用户才可以使用接口.确保了 ...

  9. Android Http POST文件上传之-----RFC1867协议

    RFC1867协议介绍            RFC1867协议主要是在HTTP协议的基础上为INPUT标签添加了file属性.同一时候限定了Form的method必须为POST,ENCTYPE必须为 ...

  10. git 基于某个分支创建分支

    1.拷贝源代码 git clone git@git地址 cd 项目目录 2.根据已有分支创建新的分支 git checkout -b yourbranchname origin/oldbranchna ...