纷析云开源版- Vue2-增加字典存储到localStorage

main.js

//保存字典数据到LocalStorage
Vue.prototype.$api.setting.SystemDictType.all().then(({data}) => {
	loadDictsToLocalStorage(data)
})

新增 dictionary.js 放在 Utils文件夹里面

// 获取字典数据
export function getDictByType(dictType) {
    const dicts = JSON.parse(localStorage.getItem('dicts') || '[]');
    // 检查 dicts 是否是数组并且非空
    if (Array.isArray(dicts) && dicts.length > 0) {
        return dicts.find(dict => dict.dictType === dictType);
    }
    console.error('字典数据格式不正确或为空');
    return null;  // 返回 null 或一个默认值
}


// 根据字典类型和值获取字典标签
export function getDictLabel(dictType, dictValue) {
    const dict = getDictByType(dictType);
    if (dict) {
        const item = dict.dataList.find(i => i.dictValue === dictValue);
        return item ? item.dictLable : '';
    }
    return '';  // 如果没有找到标签，返回空字符串
}


// 初始化时将字典数据存储到 localStorage
export function loadDictsToLocalStorage(dictData) {
    //清除数据
    localStorage.removeItem('dicts');
    // 将字典数据转换成 JSON 字符串并存储
    localStorage.setItem('dicts', JSON.stringify(dictData));


}

页面使用

<Table :datas="datas" ref="table" :border="true">
	<TableItem title="事件状态" :render="messageRender"></TableItem>
</Table>

methods: {
    messageRender(data) {
      return getDictLabel('eventStatus', data.status.toString())
    }
  }