1.首先开始项目的时候,有一些方法我们是需要全局使用的。这些很多页面需要用的、使用频率极高的方法,我们一般会将其封装为全局的方法或者局部需要混入相同的方法,数据等等,(mixins(复用方法)和filters(过滤器));
2.需要独立在untils文件夹里创建一个filters.js文件
/**
* 过滤方法
* 适用于多个组件需要公用的过滤方法
*/
const demoFiltersOne = name => {
return name+'我只是随便一个过滤方法1'
}
const demoFiltersTwo = name => {
return name+'我只是随便一个过滤方法2'
}
export {
demoFilters,
demoFiltersL
}
3.在main.js中引入
import * as filters from '@/untils/filters';
Object.keys(filters).forEach((key) => {
Vue.filter(key, filters[key]);
});
4.在其组件中使用即可
<template>
<div>
{{childData | myName}}
{{childData | demoFiltersOne }}
{{childData | demoFiltersTwo }}
</div>
</template>
export default {
// 过滤器
filters: {
// 适用于不公用的过滤方法
myName(name) {
return name+'我更改了'
}
},
};