定义一个全局的vue过滤器filter

简介

过滤器主要用于全局管理状态,格式化源数据等。

1.创建一个filters.js文件

里面可以写一些状态控制的逻辑,例如:
export function statusTypes(data) {
    switch (data) {
        case 1:
            return "状态一";
        case 2:
            return "状态二";
    }
};

data是形参可以取任意名称,不固定,这里的data参数主要是需要格式化的状态源码,例如:status:1。把1格式化为文字或者英文,这里的1就是data的取值。

2.全局注册

在main.js中做全局注册

(1).导入

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

(2).做逻辑遍历,可能有多个状态控制函数,通过vue.filter定义并注册过滤器

Object.keys(filters).forEach(key=>{
    Vue.filter(key,filters[key])
})

3.使用

可以在项目中的任意vue文件中直接使用filter文件中导出的函数,例如:
<text>{{ item.status | statusTypes }}</text>
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

友情链接更多精彩内容