一、新建dictionary、filters目录
dictionary/index.js
export default {
demandStatus: [
{ value: '', label: '全部' },
{ value: 'unpublish', label: '未发布' },
{ value: 'publish', label: '展示' },
{ value: 'close', label: '已关闭' },
],
}
filters/index.js
// 所有字典处理
export function commonFilter(val, type) {
const dictMap = {}
JSON.parse(localStorage.getItem(type)).map(item => {
dictMap[item.value] = item.label
})
return dictMap[val] || val
}
二、main.js
import * as filters from './filters' // global filters
import dictionary from './dictionary' // global dictionary
Object.keys(filters).forEach(key => {
Vue.filter(key, filters[key])
})
Object.keys(dictionary).forEach(key => {
localStorage.setItem(key, JSON.stringify(dictionary[key]))
})
三、使用
<template v-slot="{ row }">
{{ row.status | commonFilter('demandStatus') }
</template>