vue遍历数据是对数据进行筛选 过滤 排序
使用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遍历数据是对数据进行筛选 过滤 排序的更多相关文章
- Vue.js与angular在数据实现的思考
Vue.js,其简洁的API以及活跃的社区,对于打算从angular转向Vue还是挺友好的,打算最近一段时间去整理下Vue自己的一些思考,加深下对于此的印象. Vue与Angular同属于MVVM框架 ...
- 04 . Vue组件注册,组件间数据交互,调试工具及组件插槽介绍及使用
vue组件 组件(Component)是 Vue.js 最强大的功能之一. 组件可以扩展 HTML 元素,封装可重用的代码. 组件系统让我们可以用独立可复用的小组件来构建大型应用,几乎任意类型的应用的 ...
- vue 快速入门 系列 —— 侦测数据的变化 - [vue 源码分析]
其他章节请看: vue 快速入门 系列 侦测数据的变化 - [vue 源码分析] 本文将 vue 中与数据侦测相关的源码摘了出来,配合上文(侦测数据的变化 - [基本实现]) 一起来分析一下 vue ...
- 【转载】使用Pandas对数据进行筛选和排序
使用Pandas对数据进行筛选和排序 本文转载自:蓝鲸的网站分析笔记 原文链接:使用Pandas对数据进行筛选和排序 目录: sort() 对单列数据进行排序 对多列数据进行排序 获取金额最小前10项 ...
- vue 中使用 AJAX获取数据的方法
在VUE开发时,数据可以使用jquery和vue-resource来获取数据.在获取数据时,一定需要给一个数据初始值. 看下例: <script type="text/javascri ...
- PourOver – 快速筛选和排序大的数据集合
PourOver 是一个用于对大数据集合进行快速过滤的 JavaScript 库.它可以在60fps下运行,允许您构建数据研究应用和档案,即不必等待一个数据库调用来呈现查询结果. PourOver 基 ...
- 遍历Dataset并输出数据实例
转自:http://www.cnblogs.com/csdm/archive/2010/02/02/1661808.html <%@ Page Language="C#" A ...
- 02 Vue之vue对象属性功能&axios数据请求实现
1.过滤器的声明和使用 过滤器,就是vue允许开发者自定义的文本格式化函数,可以使用在两个地方:输出内容和操作数据中. 定义过滤器的方式有两种. 1 使用Vue.filter()进行全局定义 2 在v ...
- 使用for in循环遍历json对象的数据
使用for in遍历json对象数据,如果数据中的名称有为数字的话,只对正整数有效,那么先会输出为正整数的数据,后面其他的会按照原来数据中定义的顺序不变输出. 针对名称为数字的json对象数据进行测试 ...
随机推荐
- clumsy 模拟网络丢包延迟
https://www.cnblogs.com/bodboy/p/6015530.html clumsy 能在 Windows 平台下人工造成不稳定的网络状况,方便你调试应用程序在极端网络状况下的表现 ...
- 虚拟机ubuntu16下cheese打开摄像头黑屏问题
在win7上安装了一个ubuntu1604的虚拟机: 在虚拟机下打开电脑上连接的摄像头时,用ubuntu16自带的cheese软件查看是黑屏: 但是cheese上有摄像头名字显示,就是打不开:如下图 ...
- Html表格和表头文字不换行
[本文出自天外归云的博客园] 希望表头中的文字和表格中的文字不换行,只需要在th和td标签加上: nowrap="nowrap"
- Raw image encoder error: Empty JPEG image (DNL not supported)) in throwOnEror
OpenCV Error: Unknown error code -10 (Raw image encoder error: Empty JPEG image (DNL not supported)) ...
- linux 结束某个进程，并且结束子进程
pid=49184 childid=`ps -ef|grep $pid|grep -v grep|awk '{printf " %s",$2 }'` kill -9 $childi ...
- 初识RxSwift
初识Observable Observable<T> 这个类就是Rx框架的基础, 我们可以称他为可观察序列, 他的作用就是可以异步的产生一系列的Event(事件), 即一个Observab ...
- shell基础知识8-xargs命令
简介 xargs 命令应该紧跟在管道操作符之后.它使用标准输入作为主要的数据源,将从 stdin 中 读取的数据作为指定命令的参数并执行该命令. 将多行输入转换成单行输出 [root@dns-node ...
- Min-Max容斥及其推广和应用
概念 Min-Max容斥,又称最值反演,是一种对于特定集合,在已知最小值或最大值中的一者情况下,求另一者的算法. 例如: $$max(a,b)=a+b-min(a,b) \\\ max(a,b,c)= ...
- linux 打印机管理输出等命令
lp 打印文件, 对于打印文件的命令,伯克利实现版本是 lpr,而 System V 实现版本是 lplpadmin 打印机管理,添加.删除等打印机lpstat 查看打印机状态lpq 检查打印队列lp ...
- General VDPConfig对讲配置工具
General VDPConfig大华楼宇对讲配置工具是ConfigTool的一个对讲模块,主要服务对象为可视对讲的门口机和室内机,大华可视对讲在独户应用中,利用了自身在视频监控领域的优势,充分整合了 ...