vue.js数据绑定操作详解

{{ amount | currency '￥' 2 }} //若amount值为1000，则输出为￥1,000.00

pluralize：参数为{String}single,[double,triple],字符串复数化。

<p v-for="c in count">{{ c | pluralize 'item' }} {{ c | pliralize 'st' 'nd' 'rd' 'th' }} </p>

//输出结果：
1item 1st
2items 2nd
3items 3rd
4items 4th

json：参数为{Number}[indent]空格缩进数，将json对象数据输出成符合json格式的字符串。

debounce：传入值必须是函数，参数可选，为{Number}[wait]，即延时时长。作用是当调用函数n毫秒后，才会执行该动作。

<input v-on:keyup="onKeyup | debounce 500"> //input元素上监听了keyup事件，并且延迟500ms触发

limitBy：传入值必须是数组，参数为

{Number}limit

，

{Number}[offset]

，limit为显示个数，offset为开始显示数组下标。

<div v-for="item in items | limitBy 10"></div> //items为数组，且只显示数组中的前十个元素

filterBy：传入值必须是数组，参数为

{String | Function}targetStringOrFunction

,即需要匹配的字符串或函数；”in”可选分隔符。

{String}[...searchKeys]

，为检索的属性区域。

<p v-for="name in names | filterBy '1.0'">{{ name }}</p> //检索names数组中值包含1.0的元素
<p v-for="item in items | filterBy '1.0' in 'name'">{{ item | json }}</p> //检索items中元素属性name值为1.0的元素输出。检索区域也可以为数组，即in [name,version],在多个属性中进行检索。

//输出结果
vue1.0
{"name":"vue1.0","version":"1.0"}

使用自定义的过滤函数，函数可以在选项methods中定义

<p v-for="item in items | filterBy customFilter"
  methods:{
    cuestomFilter:function(item){
      if(item.name) return true;  //检索所有元素中包含name属性的元素
    }
  }

orderBy:传入值必须是数组，参数为

{String|Array|Function}sortKeys

,即指定排序的策略。

单个键名：

<p v-for="item in items | orderBy 'name' -1">{{ item.name}}</p> //items数组中以键名name进行降序排列

多个键名：

<p v-for="item in items | orderBy [name,version]">{{item.name}}</p> //使用items里的两个键名进行排序								 
 2/6   首页 上一页 1 2 3 4 5 6 下一页 尾页