使用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. Redis禁用部分危险命令（keys/flushdb等）

    在redis.conf文件[SECURITY]区域配置: 1.禁用命令: rename-command KEYS "" rename-command FLUSHALL " ...

  2. 011 webpack中使用vue

    一:在webpack中使用vue 1.安装vue的包 2.index.html <!DOCTYPE html> <html lang="en"> <h ...

  3. 让Mac终端保持(SSH)与远程的连接状态

    编辑 /etc/ssh/ssh_config 添加以下设置可解决这个问题: # 断开时重试连接的次数 ServerAliveCountMax 5 # 每隔5秒自动发送一个空的请求以保持连接 Serve ...

  4. 解决在SQLPLUS中无法使用方向键、退格键问题

    1. wget ftp://ftp.pbone.net/mirror/ftp5.gwdg.de/pub/opensuse/repositories/home:/matthewdva:/build:/E ...

  5. pytesseract.pytesseract.TesseractNotFoundError: tesseract is not installed or it's not in your path

    使用pytesseract识别验证码中遇到异常如下: pytesseract.pytesseract.TesseractNotFoundError: tesseract is not installe ...

  6. wms证书配置操作

      1. 在应用的/home下 把证书cp到/usr/local/apache2/conf 2. 打开文件/usr/local/apache2/conf/extra/httpd-ssl.conf,找到 ...

  7. CentOS7下Redis的安装与使用

    一.安装过程 1.准备工作(安装gcc依赖) # yum install gcc-c++ 2.下载并解压源码包 # cd /usr/local # wget http://download.redis ...

  8. opencc介绍

    1.什么是opencc? Open Chinese Convert(OpenCC)是一个开源的中文简繁转换项目,致力于制作高质量的基于统计预料的简繁转换词库.还提供函数库(libopencc).命令行 ...

  9. 超详尽-QThread的正确使用姿势-以及信号槽的跨线程使用

    贴上两篇博文 一.http://www.cnblogs.com/findumars/p/5031239.html 循序渐进介绍了,怎样正确的让槽函数工作在子线程中. 同时介绍了信号槽的绑定与线程的关系 ...

  10. 【记录】【java】JDK8新特性Stream方式遍历集合

    由于是以流方式,所以怎么操作也不改变原来的集合 1.普通遍历forEach List<String> list = new ArrayList(); list.add("a&qu ...