vue全局存/读取字典值

vue全局存/读取字典值
tips：如大项目常需用到很多字典值，很多数据都是从后端拿来然后控制前端的，就需要进行存储字典值，通常就是存储无数个对象嵌套对象，然后进行键值对的读取
例如：全局挂载字典

Vue.prototype.$window = {}
let lodash = require('lodash')
Vue.prototype.$window.utils = {
	//判断是否有重复
  sameObj: function sameObj(o1, o2) {
    if (o1 === o2) return true
    let keys1 = o1 && Object.keys(o1).sort()
    let keys2 = o2 && Object.keys(o2).sort()
    if (JSON.stringify(keys1) !== JSON.stringify(keys2)) {
      // console.log('不一样的属性: ' + JSON.stringify(keys1), JSON.stringify(keys2))
      return false
    }
    let isSame = true
    let len = keys1.length
    for (let i = 0; i < len; i++) {
      let key = keys1[i]
      let item1 = o1[key]
      let item2 = o2[key]
      if (typeof item1 !== typeof item2) {
        // console.log('不一样的属性: ' + key, item1, item2)
        isSame = false
        break
      }
      if (isSame && typeof item1 === 'object') {
        isSame = sameObj(item1, item2)
        if (isSame) {
          continue
        } else {
          // console.log('不一样的属性: ' + key, item1, item2)
          break
        }
      }
      if (item1 !== item2) {
        isSame = false
        // console.log('不一样的属性: ' + key, item1, item2)
        break
      }
    }
    return isSame
  },
  // 字典类型存储转换
  // 使用方法  进行读的操作
  dict: {
    /**
     * @param type {string} 字典类型
     * @returns
     */
    get (type) {
      if (this.data[type] && Object.prototype.hasOwnProperty.call(this.data[type],'itemList')) {  
        return this.data[type].itemList || []
      } else {
        return []
      }
    },
    /**
     * 根据(字典值)获取(字典名)
     * @param val {string} 字典值
     * @returns
     */
    getName (val) {
      if (!val || val === 'null') {
        return
      }
      try {
        // console.log('内层',this)  //这就是那个对象
        //其实这里也是可以拿到的  但是。。使用下面的更加准确
        // console.log(this.nameList[val].dictName || ``)
        if (Object.prototype.hasOwnProperty.call(this,'nameList')) {
          return this.nameList[val].dictName || ``
        }
      } catch (e) {
        console.warn('未找到字典名', val, this.nameList)
        return `未分类(${val})`
      }
    },
    key (type) {
      return this.data[type] || {getName: () => ('')}
    },
    init (data) {
      // 初始化字典
      let result = {}
      data && data.forEach(item => {
        let key = item.dictKey
        if (result[key]) {
          result[key].itemList = result[key].itemList.concat(item.dictList)
        } else {
          result[key] = {itemList: item.dictList}
        }
        result[key].nameList = lodash.keyBy(item.dictList, o => (o.dictValue))
        result[key].getName = this.getName
      })
      this.data = result
      // console.log(result)
      return result
    },
    data: []
  },
 }

然后当页面接口查询到数据，进行写入，当然不仅仅是写入，还会将进行处理，判断是否有重复，处理成日常比较容易读取的数据格式
写入数据：

let datas=[
      {
        dictKey:'faleDataOne',
        dictList:[
          {
            dictId: "569c1a1d-e2d9-4ca2-9ca8-aa574f49db51",
            dictKey: "faleDataOne_0",
            dictName: "假数据1.1",
            dictValue: "aaa",
          },
          {
            dictId: "569c1a1d-e2d9-4ca2-9ca8-aa574f49db51",
            dictKey: "faleDataOne_1",
            dictName: "假数据1.2",
            dictValue: "bbb",
          },
          {
            dictId: "569c1a1d-e2d9-4ca2-9ca8-aa574f49db51",
            dictKey: "faleDataOne_2",
            dictName: "假数据1.3",
            dictValue: "ccc",
          }
        ]
      },
      {
        dictKey:'faleDataTwo',
        dictList:[
          {
            dictId: "569c1a1d-e2d9-4ca2-9ca8-aa574f49db51",
            dictKey: "faleDataOne_0",
            dictName: "假数据2.1",
            dictValue: "ddd",
          },
          {
            dictId: "569c1a1d-e2d9-4ca2-9ca8-aa574f49db51",
            dictKey: "faleDataOne_1",
            dictName: "假数据2.2",
            dictValue: "eee",
          },
          {
            dictId: "569c1a1d-e2d9-4ca2-9ca8-aa574f49db51",
            dictKey: "faleDataOne_2",
            dictName: "假数据2.3",
            dictValue: "fff",
          }
        ]
      },
    ]
    //调用init方法
    this.$window.utils.dict.init(datas)

然后再读取某个值对应的字典值

 console.log(this.$window.utils.dict.key('faleDataOne').getName('ccc'))

这样就读取到对应的字典值啦，全局都可以读取，因为挂载到原型上了