文本过滤器Filters

过滤器(Filters)常用于文本的格式化，可以用在两个地方：插值表达式和v-bind属性绑定

注意：

• 要定义在filters节点下，本质是一个函数
• 在过滤器函数中，一定有return值

<p>{{name | nameFormatter}}</p>

filters: {
    nameFormatter(val) {
        // 对相应的值进行你想要的操作,记得return回去
        console.log(val);
    }
}

参数传递：首个参数一定是 管道符(|) 传递过来的，其他都是自定义的

<p>{{ item.name | nameFormatter(val1, val2, val3, ...) }}</p>

filters: {
    nameFormatters(v1, v2, v3, ...) {
        
    }
}

在filters没有this指向，想要获取data中的数据，需要在beforeCreate()钩子函数中提前将this赋值给固定的值

beforeCreate() {
    _this = this;
    // filters里面就可以直接使用  _this
}

全局过滤器和实例过滤器

全局过滤器，对每一个Vue实例都可以处理：

Vue.filter('过滤器名称', val => {
  // 一顿操作猛如虎
  return '';
})

如果全局过滤器和局部过滤器重名了，则调用局部过滤器（局部近点）

连续过滤器

Vue支持连续过滤器

<p>{{ item.name | nameFormatter1 | nameFormatter1 | ... }}<p>

item.name 在被第一个过滤器清洗后，接着被第二个过滤器清洗，直到最后