有时一个过滤器需要在项目中多次使用,此时可以将该过滤器定义为全局过滤器,全局过滤器在main.js下配置。以时间过滤器为例,当为局部过滤器写为:

filters: {
  timeForm(val) {

        if (typeof (value) == "undefined" || value === null) return "";

        let date = new Date(value);
        var y = date.getFullYear();
        var m = date.getMonth() + 1;
        var d = date.getDate();
        if (isNaN(y) && y != 0) {
          y = " ";
        }
        if (isNaN(m) && m != 0) {
          m = " ";
        } else {
          (m < 10 ? "0" + m : m);
        }
        if (isNaN(d) && d != 0) {
          d = " ";
        } else {
          (d < 10 ? "0" + d : d);
        }

        return y + "-" + m + "-" + d + " " + date.toTimeString().substr(0, 5);
}

现在我们把它设置成全局过滤器

Vue.filter('timeForm', function (value) {
  if (typeof (value) == "undefined" || value === null) return "";

  let date = new Date(value);
  var y = date.getFullYear();
  var m = date.getMonth() + 1;
  var d = date.getDate();
  if (isNaN(y) && y != 0) {
    y = " ";
  }
  if (isNaN(m) && m != 0) {
    m = " ";
  } else {
    (m < 10 ? "0" + m : m);
  }
  if (isNaN(d) && d != 0) {
    d = " ";
  } else {
    (d < 10 ? "0" + d : d);
  }
  return y + "-" + m + "-" + d + " " + date.toTimeString().substr(0, 5);
});
var timeForm = Vue.filter('timeForm');

直接定义为:Vue.filter('timeForm', function (value) { //过滤代码}

然后定义一下过滤器:var timeForm = Vue.filter('timeForm')   

使用的时候和局部过滤器相同方式使用,直接{{   value   |  filter   }}  即可
 

 

Logo

前往低代码交流专区

更多推荐