使用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. tomcat高并发优化的参数优化并查看tomcat线程数

    在Tomcat配置文件conf下面 server.xml 中的配置中和连接数相关的参数有: minProcessors:最小空闲连接线程数,用于提高系统处理性能,默认值为10 maxProcessor ...

  2. javascript – Node.js请求CERT_HAS_EXPIRED

    javascript – Node.js请求CERT_HAS_EXPIRED 转  http://www.voidcn.com/article/p-ssctwovd-bsy.html 原文   htt ...

  3. LeetCode 100. Same Tree （判断树是否完全相同）

    100. Same Tree Given two binary trees, write a function to check if they are the same or not. Two bi ...

  4. api-doc-php

    主要功能: 根据接口注释自动生成接口文档 演示地址 [Gitee Pages:]http://itxq.gitee.io/api-doc-php 开源地址: [GigHub:]https://gith ...

  5. 研发团队是该制定OKR还是KPI？

    绩效管理和OKR的目标管理,是前行的两条腿,缺谁都会寸步难行.正确的做法是把企业的使命和任务,转化为经营目标,然后再用KPI.OKR等绩效管理工具,分解.执行.考核.. KPI是一套绩效管理的方法.全 ...

  6. Linux下安装.NET Core

    环境 { "操作系统":"CentOS 7.5 64位", "CPU":"1核", "内存":&qu ...

  7. nginx入门系列之安装与卸载

    目录 通过包管理器安装 安装nginx 卸载nginx 从源码编译安装 准备安装环境 执行编译安装 制作nginx免安装包 官方安装手册:https://nginx.org/en/docs/insta ...

  8. Xamarin Assets文件读取

    在Assets文件夹中添加nlog.config文件,在属性中将Build Action设置为AndroidAsset var steam = Assets.Open("nlog.confi ...

  9. C#多线程那点事——信号量(Semaphore)

    信号量说简单点就是为了线程同步,或者说是为了限制线程能运行的数量. 那它又是怎么限制线程的数量的哩?是因为它内部有个计数器,比如你想限制最多5个线程运行,那么这个计数器的值就会被设置成5,如果一个线程 ...

  10. 「杂录」CSP-S 2019 爆炸记&题解

    考试状况 \(Day1\) \(8:30\) 解压,先打个含头文件和\(freopen\)的模板程序,准备做题. \(8:35\) 开题,心想着按顺序做吧,毕竟难度一般是按顺序排的. 第一题,一眼看过 ...