1.limitBy的用法

<body>
<div id="box">
<ul>
<li v-for="val in arr | limitBy 2 1"> <!-- 从index=1的位置取两个-->
{{val}}
</li>
</ul>
</div>
<script>

var vm=new Vue({
data:{
arr:[1,2,3,4,5]
},
methods:{

}
}).$mount('#box');

</script>

2  filterBy的用法：筛选中数组中含有a字母的值

<body>
<div id="box">
<input type="text" v-model="a">
<ul>
<li v-for="val in arr | filterBy a">
{{val}}
</li>
</ul>
</div>
<script>

var vm=new Vue({
data:{
arr:['width','height','background','orange'],
a:''
},
methods:{

}
}).$mount('#box');

</script>
</body>

3 orderBy的用法

<body>
<div id="box">
<input type="text" v-model="a">
<ul>
<li v-for="val in arr | orderBy a">
{{val}}
</li>
</ul>
</div>
<script>

var vm=new Vue({
data:{
arr:['width','height','background','orange'],
a:''
},
methods:{

}
}).$mount('#box');

</script>
</body>

vue中limitBy，filterBy，orderBy的用法的更多相关文章

  1. Vue基础01vue的基本示例，vue的双向数据绑定，vue中常见的几种用法，vue相关常见指令

    自学vue框架,每天记录重要的知识点,与大家分享!有不足之处,希望大家指正. 本篇将讲述:vue的基本示例,vue的双向数据绑定,vue中常见的几种用法,vue相关常见指令 前期学习基础,使用vue. ...

  2. vue中mixin的理解与用法

    vue中提供了一种混合机制--mixins,用来更高效的实现组件内容的复用.最开始我一度认为这个和组件好像没啥区别..后来发现错了.下面我们来看看mixins和普通情况下引入组件有什么区别? 组件在引 ...

  3. vue中computed的作用以及用法

    在vue中computed是计算属性,主要作用是把数据存储到内存中,减少不必要的请求,还可以利用computed给子组件的data赋值. 参考地址:https://www.jianshu.com/p/ ...

  4. vue中is的作用和用法

    回顾vue官方文档的过程中发现了is这个特性,虽然以我的写代码风格实在用不上,不过还是记录一下这个知识点 is的作用 <ul> <li></li> <li&g ...

  5. vue中computed和watch的用法

    computed用来监控自己定义的变量,该变量不在data里面声明,直接在computed里面定义,然后就可以在页面上进行双向数据绑定展示出结果或者用作其他处理: computed比较适合对多个变量或 ...

  6. vue 中 px转vw的用法

    下面介绍最简单的用法 1 下载依赖 npm install postcss-import postcss-loader postcss-px-to-viewport --save-dev 2 在项目根 ...

  7. vue中的.sync修饰符用法

    在项目中接触到父组件传值给子组件的时候,想在子组件改变父组件传的值.(比如用于弹窗关闭) 但是正常来说,vue2是不允许子组件直接改父组件传进去的值的. 所以我们需要在子组件内定义自定义事件,通知父组 ...

  8. Vue中jsx的最简单用法

    最终页面显示效果为 <div class="open-service" style="color: #0199f0; cursor: pointer;"& ...

  9. Vue中table表头合并的用法

    <div class="panel-container"> <div> <table class="table-head" wid ...

随机推荐

  1. 转载：开源许可证GPL、BSD、MIT、Mozilla、Apache和LGPL的区别

    转自:https://www.cnblogs.com/findumars/p/6309048.html 首先借用有心人士的一张相当直观清晰的图来划分各种协议:开源许可证GPL.BSD.MIT.Mozi ...

  2. tomcat性能优化，内存优化和并发线程连接优化

    今天被一同事问到tomcat和内存优化的问题,而网上的资料基本都是来回copy,所以抽时间随便写点.文章中设置的参数都是一个随便写的,具体的还要根据自己的情况来定. 1.内存优化: 说到tomcat不 ...

  3. 因xhost命令和DISPLAY环境变量操作不当导致无法启动Oracle图形化安装界面

    在redhat操作系统上安装Oracle 11.1时,遇到在执行runInstaller后无法启动安装图像化界面,甚是郁闷. 问题现象: 使用Xmanager2.0软件登陆AIX桌面,root用户可以 ...

  4. windows文本操作字符命令含义

    r 打开只读文件,该文件必须存在. r+ 打开可读写的文件,该文件必须存在. rb+ 读写打开一个二进制文件,只允许读写数据. rt+ 读写打开一个文本文件,允许读和写. w 打开只写文件,若文件存在 ...

  5. Open cup #2

    A D:用前面的H去消去后面的K 然后求最长连续的M F:在每一列/行里面求最大的数然后组成最大的和ans[]里的比求出最大的 L:并查集 J:DP背锅题 01背包 先求出M种里每种的size和las ...

  6. Windows KMS激活脚本

    @echo off&setlocal EnableDelayedExpansion&color 3etitle Windows KMS激活脚本 --by David :: 如果激活失败 ...

  7. 【hiho1035】自驾旅行III

    题目大意:给定一棵 N 个节点的有根树,1 号节点为根节点,树边有两个权值,分别为走路的代价和开车的代价.有一个旅行者开车要从根节点出发,必须遍历给定点集,可以在任何位置停止旅行,有车时可以选择开车或 ...

  8. WebKitBrowser

    WebKit.net是对WebKit的.Net封装, 使用它.net程序可以非常方便的集成和使用webkit作为加载网页的容器. 首先 下载WebKit.net 的bin文件. 然后 新建一个Wind ...

  9. qt5-帮助文档的说明

  10. python-文件校验

    使用hashlib的md5方法对文件进行加密,目的是为了保证文件在传输的过程中是否发生变化. #!/usr/bin/python3 # coding:utf-8 # Auther:AlphaPanda ...