zoukankan      html  css  js  c++  java
  • vue——store全局存储

    业务场景:刷新页面时,首次拉取所有配置,存储到store状态管理用于全局调用;

    import Vue from 'vue'
    import Vuex from 'vuex'
    import userInfo from './modules/user'
    Vue.use(Vuex)
    export default new Vuex.Store({
      modules: {
        userInfo, // 用户信息:读取方式this.$store.state.userInfo.xxxx.xx
      },
      state: { // 初始状态或更新后的状态,读取方式:this.$store.state.businessInfo.id;
        businessInfo: {// 业务信息:省去了一层中间参数
          cname: '',
          ename: '',
          id: ''
        }
      },
      mutations: { // 更新状态内容:this.$store.commit('GET_CREDID_INFO', businessInfo);
        GET_BUSINESS_INFO (state, newInfo) {
          state.businessInfo = newInfo
        }
      },
      actions: { //触发状态更新,当需要更新多个状态的时候使用,如this.$store.dispatch('getBusinessInfo', newInfo);
        getBusinesInfo({ commit, state }, newInfo) {
          // commit('GET_USER_INFO', newInfo.userInfo)
        commit('GET_BUSINESS_INFO',newInfo.businessInfo) } } })

    为避免状态命名重复,使用modules进行管理:

    const state = {// 全局参数的初始状态
      credid: '', // 应用管理:配置、发布的credid
      data: null // 是否返回应用(特征)管理首页
    }
    
    const mutations = { // 更新全局状态
      SET_APP_CREDID (state, val) {
        state.credid = val
      },
      SET_APP_MANAGE (state, val) {
        state.data = val
      }
    }
    const actions = { // 可以不设置触发动作
      setAppManage ({ commit }, val) {
        commit('SET_APP_MANAGE', val)
      }
    }
    
    export default {
      state,
      mutations,
      actions
    }
  • 相关阅读:
    hdu 4496 D-City 并查集
    hdu 4493 Tutor 水题
    codeforces 377A. Puzzles 水题
    hdu 1257 小希的迷宫 并查集
    图论500题
    cdoj 93 King's Sanctuary 傻逼几何题
    cdoj 题目简单分类
    cdoj 80 Cube 水题
    cdoj 71 I am Lord Voldemort 水题
    cdoj 65 CD Making 水题
  • 原文地址:https://www.cnblogs.com/wheatCatcher/p/11169265.html
Copyright © 2011-2022 走看看