abp-vnext-pro 实战（六，vue 前端状态pinia）

在login的时候把所有写入全局store，

        console.log('----------------从数据库获取字典--------------------');
        const appStore = useAppStore();
        const dataDictionaryServiceProxy = new DataDictionaryServiceProxy();
        const detailInput = new PagingDataDictionaryDetailInput();
        detailInput.dataDictionaryId = '3a0cd740-f56e-db56-2a4e-00c1e9fb6880';
        const obj = (await dataDictionaryServiceProxy.pageDetail(detailInput));
        console.log(obj);
        const employees = new Map();
        for (var dic of obj.items) {
          console.log(dic.code + ':' + dic.displayText);
          employees.set(dic.code, dic.displayText);
        }

        appStore.setDictionary(employees);

取值

export function dataDictGetText(code) {
  const appStore = useAppStore();
  const dict = appStore.getDictionary;
  console.log(dict);
  if(dict!=null)
    return dict.get(code+'');

}

pinia 状态管理，在user.ts

interface AppState {

  //字典数据
  dataDictionary: Map<string, string>;
}
let timeId: TimeoutHandle;
export const useAppStore = defineStore({
  id: 'app',
  state: (): AppState => ({

    dataDictionary: undefined,
  }),
  getters: {
     getDictionary(): Map<string,string> {
      return this.dataDictionary || new Map(JSON.parse(localStorage.getItem('app_dict')));
    },
  actions: {
    setDictionary(dict): void {

       this.dataDictionary = dict;
       localStorage.setItem('app_dict', JSON.stringify([...dict]));

    },

浏览器刷新按钮，store的状态又变成初始值了 undefined， 上面用了localStorage来保存map