在vue脚手架中全局使用过滤器 filters

方法一：

在filters.js中

//格式时间
export const formatDate = time => {
  if ((time = "" || !time)) {
    return "——";
  } else {
  //moment挂载在vue原型上
    var date = this.moment(time).format("YYYY-MM-DD HH:mm:ss");
    return date;
  }
};
//========================
//美化价格
export const formatMoney = function(value) {
  if (value) {
    value = Number(value);
    return "￥ " + value.toFixed(2);
  }
};
//=======================
//时间字符串截取
export function subTime(date) {
  var json_date = new Date(date).toJSON();
  return new Date(new Date(json_date) + 8 * 3600 * 1000)
    .toISOString()
    .replace(/T/g, " ")
    .replace(/\.[\d]{3}Z/, "");
}
// let date = subTime("2020-06-27T14:20:27.000000Z");
// console.log(date); // 2020-06-27 14:20:27

 //export {formatDate ,formatMoney ,formatTimer}

在main中

 import * as filters from "./utils/filters";
 //将导出的每个方法挂载原型
 Object.keys(filters).forEach(k => Vue.filter(k, filters[k]))

使用：

<p>价格：{{ price | formatMoney }}</p>

方法二：

在filters.js中

import Vue from "vue";

export default function() {
  // 时间过滤
  Vue.filter("formatDate", function(time) {
    if ((time = "" || !time)) {
      return "——";
    } else {
      var date = this.moment(time).format("YYYY-MM-DD HH:mm:ss");
      return date;
    }
  });

  // 人民币过滤
  Vue.filter("formatMoney", function(value) {
    if (value) {
      value = Number(value);
      return "￥ " + value.toFixed(2);
    }
  });
}

main.js

 import vueFilter from '@/utils/filter'
 vueFilter(Vue);

使用：

<p>价格：{{ price | formatMoney }}</p>
//可以通过this.$options.filters["formatDate"](params)函数调用