vue过滤器的使用

vue 对数据提供一个  filter 的处理器，虽然命名为  filter  ，但是我觉得叫做数据处理器更体贴。用以在不改变的data 的情况下  输出前段需要的格式数据。

基本用法：

处理时间的例子

<div class="time">{{rating.rateTime | formatDate}}</div>

  filters: {
    formatDate (time) {
      let date = new Date(time)
      return format(date, 'yyyy-MM-dd hh:mm')
    }
  }

export function format (date, fmt) {
  if (/(y+)/.test(fmt)) {
    // RegExp.$1是RegExp的一个属性,指的是与正则表达式匹配的第一个 子匹配(以括号为标志)字符串
    fmt = fmt.replace(RegExp.$1, (date.getFullYear() + '').substr(4 - RegExp.$1.length))
  }
  let o = {
    'M+': date.getMonth() + 1,
    'd+': date.getDay(),
    'h+': date.getHours(),
    'm+': date.getMinutes(),
    's+': date.getSeconds()
  }
  for (let k in o) {
    if (new RegExp(`(${k})`).test(fmt)) {
      let str = o[k] + ''
      fmt = fmt.replace(RegExp.$1, (RegExp.$1.length === 1) ? str : padLeftZero(str))
    }
  }
  return fmt
}

function padLeftZero (str) {
  return ('00' + str).substr(str.length)
}

<div class="time">{{message | filterFun }}</div>

再一个{{message}}模板中，可以添加多个filter对message进行处理     | 表示filter

在filter可以传多个参数，但是filters的function的默认第一个参数为当前message的值，所以函数的时候自定义参数是从第二位开始传的