使用computed 方法来过滤筛选数据;或者使用methods 方式来筛选过滤数据

<body>
<div id="app">
<ul>
<li v-for="item in list">{{item.id}}</li>
</ul>
<ul>
<li v-for="item in listCmputed">{{item.id}}</li>
</ul>
<ul>
<li v-for="item in listMe(list)">{{item.id}}</li>
</ul> </div>
</body>
<script>
var app=new Vue({
el:'#app',
data:{
list:[{id:11},{id:22},{id:33},{id:44},{id:55},{id:66}],
},
computed:{
listCmputed:function(){
return this.list.filter(function(item){
return item.id>=33
})
}
},
methods:{
listMe:function(list){
return list.filter(function(item){
return item.id<=33
})
}
}
})
</script>

  

vue遍历数据是对数据进行筛选 过滤 排序的更多相关文章

  1. Vue.js与angular在数据实现的思考

    Vue.js,其简洁的API以及活跃的社区,对于打算从angular转向Vue还是挺友好的,打算最近一段时间去整理下Vue自己的一些思考,加深下对于此的印象. Vue与Angular同属于MVVM框架 ...

  2. 04 . Vue组件注册,组件间数据交互,调试工具及组件插槽介绍及使用

    vue组件 组件(Component)是 Vue.js 最强大的功能之一. 组件可以扩展 HTML 元素,封装可重用的代码. 组件系统让我们可以用独立可复用的小组件来构建大型应用,几乎任意类型的应用的 ...

  3. vue 快速入门 系列 —— 侦测数据的变化 - [vue 源码分析]

    其他章节请看: vue 快速入门 系列 侦测数据的变化 - [vue 源码分析] 本文将 vue 中与数据侦测相关的源码摘了出来,配合上文(侦测数据的变化 - [基本实现]) 一起来分析一下 vue ...

  4. 【转载】使用Pandas对数据进行筛选和排序

    使用Pandas对数据进行筛选和排序 本文转载自:蓝鲸的网站分析笔记 原文链接:使用Pandas对数据进行筛选和排序 目录: sort() 对单列数据进行排序 对多列数据进行排序 获取金额最小前10项 ...

  5. vue 中使用 AJAX获取数据的方法

    在VUE开发时,数据可以使用jquery和vue-resource来获取数据.在获取数据时,一定需要给一个数据初始值. 看下例: <script type="text/javascri ...

  6. PourOver – 快速筛选和排序大的数据集合

    PourOver 是一个用于对大数据集合进行快速过滤的 JavaScript 库.它可以在60fps下运行,允许您构建数据研究应用和档案,即不必等待一个数据库调用来呈现查询结果. PourOver 基 ...

  7. 遍历Dataset并输出数据实例

    转自:http://www.cnblogs.com/csdm/archive/2010/02/02/1661808.html <%@ Page Language="C#" A ...

  8. 02 Vue之vue对象属性功能&axios数据请求实现

    1.过滤器的声明和使用 过滤器,就是vue允许开发者自定义的文本格式化函数,可以使用在两个地方:输出内容和操作数据中. 定义过滤器的方式有两种. 1 使用Vue.filter()进行全局定义 2 在v ...

  9. 使用for in循环遍历json对象的数据

    使用for in遍历json对象数据,如果数据中的名称有为数字的话,只对正整数有效,那么先会输出为正整数的数据,后面其他的会按照原来数据中定义的顺序不变输出. 针对名称为数字的json对象数据进行测试 ...

随机推荐

  1. windows命令行将应用程序加入环境变量

    1.命令行方法,最快(推荐): 1.1.获取应用安装绝对路径: 方法一:一层层点进去,然后复制路径栏目:方法二:打开软件执行文件所在目录,按住shift点击鼠标邮件,选择powerShell,现在wi ...

  2. iOS逆向(五)-ipa包重签名

    为什么要重签名? 1.在没有源代码的情况下,你已经对某个应用进行了资源修改(比如修改了启动图或图标等).修改完成以后,如果想要让APP可以正常使用,该APP一定要重新签名然后压缩成IPA文件. 2.如 ...

  3. [原]JSON 字符串(值)做判断,比较 “string ”

    现在我这样一个json字符串: char* cjson = "{\"code\": \"200\", \"code2\": 200 ...

  4. Linux 磁盘管理_016

    以5个方面讲解 1. 硬盘 2. 磁盘RAID.LVM等 3. 磁盘分区 4. 磁盘格式化 5. 磁盘挂载后磁盘管理 一.硬盘 硬盘分类 备注 机械硬盘 IDE  SCSI  SATA  SAS 固态 ...

  5. matlab学习笔记12_2创建结构体数组,访问标量结构体,访问非标量结构体数组的属性,访问嵌套结构体中的数据,访问非标量结构体数组中多个元素的字段

    一起来学matlab-matlab学习笔记12 12_2 结构体 创建结构体数组,访问标量结构体,访问非标量结构体数组的属性,访问嵌套结构体中的数据,访问非标量结构体数组中多个元素的字段 觉得有用的话 ...

  6. shell基础知识之 stdin,stdout,stderr和文件描述符

    stdin,stdout,stderr stdin=0 stdout=1 stderr=2 使用tee来传递内容,把stdout 作为stdin 传到下个命令 root@172-18-21-195:/ ...

  7. EasyDSS高性能RTMP、HLS(m3u8)、HTTP-FLV、RTSP流媒体服务器解决方案之多方式虚拟直播

    EasyDSS流媒体解决方案之虚拟直播 虚拟直播相对于传统的实时直播的差别在于,实时的直播在于播放的是一个实时的直播流,而虚拟直播,可能适应范围更加的广.虚拟直播,不仅仅可以播放实时的视频直播流,也可 ...

  8. LODOP常见问题连接(含常见小问答博文)

    问答大全 纸张打印机 注册 table表格 clodop测试地址 字体 超文本 行间距.字间距 clodop回调函数 条码 页眉页脚 SET……STYLEA 水平居中 简短排查 提示报错 慢进度条 套 ...

  9. K8S使用入门-添加一个node

    上一篇博客我们已经将K8S部署起来了,现在我们就来介绍一下如何简单使用K8S (1)添加节点 注意事项:不能和k8s master节点的主机名一样.否则会导致k8s无法正常识别出该节点 添加节点是比较 ...

  10. 一段隐藏文字的css代码,记录下

    <span style="width:1px; height:1px; color:#fff; outline-width:hidden; overflow:hidden; displ ...