Vuex:从另一个模块访问状态

时间:2016-12-28 16:52:22

标签: javascript vue.js vuex

我想从state.session访问instance.js中的records_view.js。这是如何完成的?

商品/模块/ instance.js

const state = {
  // This is what I want to access in records_view.js
  session: {}
};

const getters = {
  sessionGetter: state => state.session
};

商品/模块/ records_view.js

const actions = {
  getSettingsAction (context, props) {
    // This is how I'm trying to access session, which doesn't work
    let session = context.state.instance.session;

    Api(
      context,
      {
        noun: props.noun,
        verb: 'GetRecordsViewSettings',
        orgUnitKey: _.has(session, 'orgunit.key') ? session.orgunit.key : '',
        data: {}
      },
      props.callback
    );
  }
};

这是为了增加一些背景。

商品/ index.js

import Vue from 'vue';
import Vuex from 'vuex';
import * as actions from './actions';
import * as getters from './getters';
import * as types from './mutation-types';

import instance from './modules/instance';
import recordsView from './modules/records_view';

Vue.use(Vuex);

export default new Vuex.Store({
  state,
  actions,
  getters,
  mutations,
  modules: {
    instance,
    recordsView
  }
});

6 个答案:

答案 0 :(得分:59)

[['58478000'], ['', ''], [''], ['', ''], ['NEW'], ['', ''],['2016-12-28T14:34:18'], ['', ''], ['C'], ['', ''], [''], ['', ''],[''], ['', ''], ['N'], ['', ''], ['N'], ['', ''], ['ON'], ['', ''],['2017-03-15'], ['', ''], ['2022-03-15'], ['', ''], [' 30/360'], ['',''], ['EUR'], ['', ''], ['IR'], ['', ''], [''], ['', ''],['InterestRate:IRSwap:FixedFloat'], ['', ''], ['Trade'], ['', ''],['EUR-EURIBOR-Reuters'], ['', ''], ['FIXED'], ['', ''], ['Percent'],['', ''], ['-0.003'], ['', ''], [''], ['', ''], [''], ['', ''],['EUR'], ['', ''], ['EUR'], ['', ''], ['25,000,000'], ['', ''],['25,000,000'], ['', ''], ['3M'], ['', ''], ['1Y'], ['', ''], ['3M'],['', ''], [''], ['', ''], [''], ['', ''], [''], ['', ''], [''], ['',''], [''], ['', ''], [''], ['', ''], [''], ['', ''], [''], ['', ''],[''], ['', ''], [''], ['', ''], [''], ['', ''], [''], ['', ''], ['']]引用本地状态,访问其他模块的状态时应使用state

rootState

文档:https://vuex.vuejs.org/en/modules.html

答案 1 :(得分:8)

来自行动:

'contacts:update' ({ commit, rootState }) {
    console.log('rootState', rootState.users.form)
    ......

  },

答案 2 :(得分:2)

对我来说,我有vuex模块,但需要进行更改以更新其他文件中的STATE。通过添加THIS

即使在模块中,您也可以通过console.log(this.state)查看您有权访问的全局状态

const mutations = {
MuteChangeAmt(state, payload) {
//From user module; Need THIS keyword to access global state
this.state.user.payees.amount = payload.changedAmt;
 }
}

答案 3 :(得分:2)

就我而言,这就是我的工作方式。

在ModuleA.js文件中:

Module A:  
export const state = {
    parameterInA: 'A'
 }
export const action = {
    showParameterB() {
    console.log("Parameter B is: " + this.state.B. parameterInB)
}

在ModuleB文件中:

export const state = {
    parameterInB: 'B'
 }

export const action = {
    showParameterA() {
    console.log("Parameter A is: " + this.state.A.parameterInA)
}  

您将需要在index.js中将root导入ModuleA和B:

import * as A from 'ModuleA.js'  
import * as B from 'ModuleB.js'

这样,状态参数可以在子模块中交叉引用。

答案 4 :(得分:2)

[
    {
        "idclient": 0,
        "users": {
            "0": {
                "id": 192,
                "uid": 12,
                "level": 3
            }
        }
    }
]

其中“instance”是模块名称,“session”是您尝试访问的 Vuex 状态变量。

答案 5 :(得分:0)

您需要在状态中定义session,如下所示,以便在getters中访问它:

const state = {
  session: ''
}

你必须写一个mutation,你将从你的行动中调用它来设置这个状态值。