vue 时间过滤器的简单使用

关于过滤器的使用，这里简单介绍，并以时间函数的使用为案例进行描述：

过滤器的创建

新建文件filters.js

import moment from 'moment'

  /**

   * 普通日期格式化函数

   * data: yyyy-MM-dd

   * time: hh:mm:ss

   * yyyy-MM-dd hh:mm:ss 默认

   * 或者传入需要的格式

  */

  export const datetime = (time, pattern) => {

    let value = moment(time)

    let tempPattern = 'YYYY-MM-DD HH:mm:ss'

    if (!pattern) {

      return value.format(tempPattern)

    }

    switch (pattern) {

      case 'date':

      tempPattern = 'YYYY-MM-DD'

      break

      case 'time':

      tempPattern = 'HH:mm:ss'

      break

      default:

      tempPattern = pattern

      break

    }

    return value.format(tempPattern)

  }

main.js文件引入

import * as filters from './filters/filters.js'

Object.keys(filters).forEach(name => {

  Vue.filter(name, filters[name])

})

页面使用

语法：<any>{{表达式|过滤器}}</any>

<p>{{releaseTime | datetime('YYYY-MM-DD HH:mm:ss')}}</p>