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对象数据进行测试 ...
随机推荐
- docker 镜像制作
# wget https://mirrors.tuna.tsinghua.edu.cn/anaconda/archive/Anaconda3-5.3.1-Linux-x86_64.sh# bash A ...
- C#中得到每周，每月，每季，每年的年初末日期
DateTime表示时间上的一刻,通常以日期和当天的时间表示.借用这个结构,我们可以实现较丰富的功能,本文给出得到每周每天的方法,及得到本月第一天,本月最后一天,本季第一天,本季最后一天,本年第一天及 ...
- Logstash配置以服务方式运行
Logstash官网最新版下载地址以及YUM源:https://www.elastic.co/cn/downloads/logstash Logstash最常见的运行方式即命令行运行 ./bin/lo ...
- WebDataBinder 学习顺序
01. 关于Spring属性处理器PropertyResolver以及应用运行环境Environment的深度分析,强大的StringValueResolver使用和解析[享学Spring] http ...
- [转]C/C++实现回调机制的几种方式（回调、槽、代理）
转自:https://www.jianshu.com/p/4f907bba6d5f (1)Callback方式(回调) Callback的本质是设置一个函数指针进去,然后在需要需要触发某个事件时调用该 ...
- es查询示例
1. 建立连接 from elasticsearch import Elasticsearch es = Elasticsearch(["localhost:9200"]) 2. ...
- [Golang] http.Post导致goroutine泄漏
记录一个用http.Post的问题 if _, err := http.Post("http://127.0.0.1:8080", "", nil); nil ...
- 修改Window服务器虚拟内存位置
系统采用的是windows server2008操作系统,硬件部门在分配磁盘的时候C盘只有50G,其中虚拟内存就占用了30G,再除去操作系统占用空间,可用自由支配空间较小,会出现在部分异常情况下C盘占 ...
- mysql数据库事务类型
出自:https://blog.csdn.net/u014439239/article/details/78086729 数据库事务有不同的隔离级别,不同的隔离级别对锁的使用是不同的,锁的应用最终导致 ...
- 使用 Nginx 阻止恶意 IP 访问
找到具有明显特征的访问记录,比如: /Dec/::: +] "-" "Ouija_x.86/2.0" "-" 也许是某个开源框架的漏洞,执行 ...