过滤 与 全文索引

<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. 队列 P1160 队列安排(啊啊 不会啊)

    洛谷 题目描述 一个学校里老师要将班上N个同学排成一列,同学被编号为1-N,他采取如下的方法: 1.先将1号同学安排进队列,这时队列中只有他一个人: 2.2-N号同学依次入列,编号为i的同学入列方式为 ...

  2. [JSOI2007]重要的城市(x)

    开始(脑残ing)诶? 暴力能过 噼里啪啦码码码 TLE TLE 啥?看错复杂度?带个25的常数 ?*……!%@……*%#…!@#!@#……*!@#& Floyd,并记录两点间的一个重要的城市 ...

  3. 【bzoj1604】【[Usaco2008 Open]Cow Neighborhoods】简单的谈谈曼哈顿距离

    (最近p站上不去要死了) Description 了解奶牛们的人都知道,奶牛喜欢成群结队.观察约翰的N(1≤N≤100000)只奶牛,你会发现她们已经结成了几个"群".每只奶牛在吃 ...

  4. [CF911C]Three Garlands

    题目大意: 给你三个灯,分别以k1秒一次,k2秒一次和k3秒一次的频率闪烁着. 你可以自定义三个灯开启的时间,问是否有一种方案,使得max(k1,k2,k3)秒之后,每秒钟都至少有一盏灯闪烁. 思路: ...

  5. 十. 图形界面(GUI)设计13.鼠标事件

    鼠标事件的事件源往往与容器相关,当鼠标进入容器.离开容器,或者在容器中单击鼠标.拖动鼠标时都会发生鼠标事件.java语言为处理鼠标事件提供两个接口:MouseListener,MouseMotionL ...

  6. 使用jmatio读写matlab数据文件

    /** * Created by hfz on 2016/2/23. */ import com.jmatio.io.*; import com.jmatio.types.MLDouble; impo ...

  7. Mac Screen Capture Shortcuts

    Here's How:   To capture the entire desktop, press Command-Shift-3. The screen shot will be automati ...

  8. Android Facebook和Twitter登录和分享完整版

    最近公司的软件需要改国际版,需要Facebook和Twitter的登录和分享. 本人先用Umeng的第三方社会化分享实现了该功能,但是后来一想问题来了,经过查证.Umeng只在中国和美国有服务器,那也 ...

  9. C#远程获取图片文件流的方法【很通用】

    因为之前写的代码,也能获取到图片流信息,但是会是凌乱的线条,后百度得这个方法,必须记录一下 C# try { WebRequest myrequest = WebRequest.Create(Http ...

  10. [转载]Ubuntu 14.04中root 密码忘记解决方法

      Ubuntu 14.04中root 密码忘记解决方法 方法一: 如果用户具有sudo权限,那么直接可以运行如下命令: #sudo su root #passwd #更改密码 或者直接运行sudo ...