Vuex 스토어 모듈 액세스 상태

Vuex 스토어 모듈 액세스 상태

다른 파일에서 모듈 스토어/스테이트에 액세스하는 방법을 알고 싶습니다.지금까지의 코드는 다음과 같습니다.

/store/index.displaces

import Vuex from 'vuex';
import categories from './modules/categories';

Vue.use(Vuex);
const store = new Vuex.Store({
  state: {
  },
  actions: {

  },
  mutations: {

  },
  getters: {

  },
  modules: {
    categories,
  },
});
export default store;

/store/categories/categories.js

const categories = {
  state: {
    categories: [
      {
        name: 'category1'
        path: 'path/to/there'
        subcategories: [
          {
            name: 'subcategory1'
            path: 'path/to/other/there'
            subsubcategory: [
              {
                name: 'subsubcategory1'
                path: 'path/to/other/there'
              }
              {
                name: 'subsubcategory1'
                path: 'path/to/other/there'
              }
            ]
          }
          {
            name: 'subcategory2'
            path: 'path/to/other/there'
          }
        ]
      }
      {
        name: 'category2'
        path: 'path/to/there'
        subcategories: [
          {
            name: 'subcategory2'
            path: 'path/to/other/there'
          }
          {
            name: 'subcategory3'
            path: 'path/to/other/there'
          }
        ]
      }
    ]
  },
  actions: {

  },
  mutations: {

  },
  getters: {

  },
}

edit: /home 등의 모듈 상태/스토어에 액세스할 수 있어야 합니다.표시하다

<template>
  <div>
    <Headers></Headers>
    <div class="user row">
      <p>User Page</p>
      <p> I want to be able to access modules store/state here and be able to pass getters here to filter some results from state</p>
    </div>
    <Footers></Footers>
  </div>
</template>

<script>

import 'vue-awesome/icons';
import { mapState, mapGetters } from 'vuex';
import Headers from '/Headers';
import Footers from '/Footers';

export default {
  name: 'home',
  data() {
    return {
    };
  },
  methods: {
  },
  components: {
    Headers,
    Footers,
  },
  computed: {
    ...mapGetters([
      '',
    ]),
    ...mapState([
      'categories',
    ]),
  },
};
</script>

<style lang="scss" scoped>

</style>

이전에는 카테고리에 접속하여 루프를 할 수 있었지만, @Sumit-Ridhali에 접속하면 스토어 모듈이 잘못되어 있는 것을 알게 되어 변경할 필요가 있었지만, 그 상태에 액세스 하는 방법을 알 수 없게 되었습니다.

미리 말해, 치어

store.state.module name" "상태 데이터"

저는 이런 모듈을 보관하고 있습니다.

이것은 인덱스 스토어입니다.stores/index.displays

import Vue from 'vue'
import Vuex from 'vuex'
import createPersistedState from 'vuex-persistedstate'
import posts from '@/store/posts' // import external store mod
Vue.use(Vuex)
export default new Vuex.Store({
  modules: {
    posts
  },
  strict: true,
  plugins: [
    createPersistedState()
  ],
  state: {...... etc

포스트 스토어 모듈

  // how to access this store console.log('module state', store.state.posts.data)
    export default {
      state: {
        data: 'dfsd'
      },
      getters: {
      },
      mutations: {
      },
      actions: {
      }
    }

저장소 모듈 데이터 가져오기

'@/store/'에서 스토어 가져오기

store.state를 클릭합니다.posts.data

언급URL : https://stackoverflow.com/questions/43738186/vuex-store-module-access-state