$store 객체를 사용하여 Vuex 하위 모듈 내부 상태에 액세스

$store 객체를 사용하여 Vuex 하위 모듈 내부 상태에 액세스

import Vue from 'vue'
import Vuex from 'vuex'
import Users from './modules/Users'

Vue.use(Vuex)

export const store = new Vuex.Store({
    namespaced: true,
    state: {
        foo: false,
    },
    modules: {
        Users
    },
})

및 Users.js:

// initial state
const state = {
    users: [],
}
export default {
    state
}

내 컴포넌트로부터, 나는 에 접속하고 있다.Users다음과 같이 저장:

this.$store.state.Users.users.forEach((el) => {}

그런데 왜 전화를 해야 하는지 이해가 안 돼.this.$store.state.Users대신에this.$store.Users

내 말은, 모듈이Users상점 주 내에서 정의되지 않았는가?

설명:

this.store.state.Users.users

• 맨 처음 것, 제1; 전자Users속성 액세서리가 모듈의 이름을 나타냄.
• 두 번째users속성은 다음 상태의 내부 개체 속성을 나타낸다.Users모듈

전화하고 싶으면this.$store.state.Users대신에this.store.state.Users.users사용자 배열에 대한 액세스 권한을 얻으려면 정의하십시오.Users.js조금 다른 방법으로

코드 참조:

Users.js

// initial state
const state = []
export default {
    state
}

이제 상태는 평평하다. 그래서 여분의 데이터 접근자가 필요하지 않다.

세컨드 베터 옵션

게이터를 사용한다.

두 번째 옵션은 코드를 참조하십시오.

const state = {
  users: []
}
const getters = {
  getUsers(state) {
    return state.users
  }
}

export default {
 state,
 getters
}

이제 다음과 같이 쓰십시오.$this.store.getters['getUsers']

아마 당신하고 함께.namespaced:true이것보다 조금 더 많은 노력이 필요할 것이다.그것을 연구하다

편집 1

this.$store하나의 대상이다.그것에는 포함되어 있다.mutations,getters, 같은 방법들dispatch기타 등등.이 개체의 속성 중 하나는state그 자체로그래서 만약 당신이 직접 주(州)에 접근하고 싶다면$store객체, 직접 액세스해야 함:this.$store.state ...

this.$store.Users.state이런 일은 일어나지 않는다.vuex 엔진은 다른 엔진을 추가하지 않는다.state각 모듈에 대한 속성.

두 번째 더 나은 선택-게이터를 택하다.그게 최선의 방법이야

참조URL: https://stackoverflow.com/questions/46839348/accessing-vuex-submodules-inner-state-with-the-store-object