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对象数据进行测试 ...
随机推荐
- RSA前台加密后台解密的应用
写在前面 项目安全测试需要将登录功能修改, AES加密不符合要求, 现改为RSA非对称加密.(将登录密码加密后传给后台, 后台解密后再进行一系列的校验) .期间遇到了前台js加密但是后台解密失败的问题 ...
- SELECT DISTINCT ON expressions must match initial ORDER BY expressions
开发说pg中执行sql报错,发来消息让帮看看: SELECT DISTINCT ON expressions must match initial ORDER BY expressions 详细语句如 ...
- 【Python】解析Python中的迭代器
目录结构: contents structure [-] Iterator VS Iterable Itertools 模块 生成器(Generator) 在开始文章之前,先贴上一张Iterable. ...
- linux 压缩、解压、zip/unzip/jar
网上很多人说用jar命令解压,但jar命令解压时不能指定目录,推荐使用unzip解压war包. unzip -d 指定目录 [root@oracle upload]# unzip -oq common ...
- Qt 一张图片显示在其他组件之上
图片放在QLabel上,注意设置QLable一些属性 QImage img("test.png"); img = img.scaledToWidth(,Qt::SmoothTran ...
- leetcode No.500 键盘行 keyboard-row (Python3实现)
题目描述 给定一个单词列表,只返回可以使用在键盘同一行的字母打印出来的单词.键盘如下图所示. 示例: 输入: ["Hello", "Alaska", " ...
- k8s记录-k8s基本概念和术语
每次个节点上当然都要运行Docker.Docker来负责所有具体的映像下载和容器运行. Kubernetes主要由以下几个核心组件组成: etcd保存了整个集群的状态: apiserver提供了资源操 ...
- Egret自定义计时器（TimerManager和Laya.timer）
一 自定义计时器 因为游戏中经常用到计时器,比如每1秒发射一枚子弹啊,每2秒怪物AI自动转向啊 每次去new Timer 然后addEventListener(egret.TimerEvent... ...
- 解决IDEA打Jar包找不到或无法加载主类问题
转自以下博主内容:https://blog.csdn.net/qq_43189115/article/details/99856659 就是因为打包一直提示有问题,网上很多帖子试过没有用,就是这个博主 ...
- MNN配置
1.github链接:https://github.com/alibaba/MNN/tree/master/tools/converter 2.教程 (1)使用教程:https://www.books ...