vue中局部过滤器和全局过滤器的使用

283 阅读1分钟

过滤器

本质是一个函数,分为局部过滤器和全局过滤器
**如何定义过滤器**
局部过滤器
	在单文件组件中定义的过滤器,在filters选项结构中定义,只有在当前组件中可以使用.
            
	语法:filters:{过滤器名称:function(value){return}} //函数简写:filters:{自定义过滤器名称(value) {return}   }
            
	特性:一般会有参数、一般会有返回值
全局过滤器
	在单独的js文件中定义全局过滤器,全局过滤器所有组件都可以使用
	语法:Vue.filter('过滤器名称',function(参数){return ...})
	注意点:main.js中定义,已经引入了Vue,单独模块中,自己再引入Vue
**如何使用过滤器**
局部过滤器的使用:通过管道符使用过滤器,那里需要使用过滤器,就在这个位置添加管道符
	管道符: |
	{{源数据 | 过滤器名称}}
全局过滤器的使用:如果在main.js中定义全局过滤器,在组件中可以直接使用
		如果是单独的模块文件中定义全局过滤器,那么需要在组件中引入这个模块再使用
重要特性
	调用过滤器,会将 | 前面的数据做为参数传递
	过滤器的第一个参数就是要处理的源数据
	如果调用过滤器的时候手动传递了参数,也不会影响默认数据的传递,意味着用户参数从参数列表的第二个开始