I have created a state ~/store/modules/general/index.js

There are get_info and get_pages Actions,

states info and pages,

When i use

...mapActions({
getInfo: 'modules/general/get_info'
getPages: 'modules/general/get_pages'
})

Works fine, but when i try to access it via

...mapState({
Info: 'modules/general/info'
Pages: 'modules/general/pages'
})

Return undefined

When i use

...mapState({
modules: 'modules'
})

this return all my substates plz help

I have created a state ~/store/modules/general/index.js

There are get_info and get_pages Actions,

states info and pages,

When i use

...mapActions({
getInfo: 'modules/general/get_info'
getPages: 'modules/general/get_pages'
})

Works fine, but when i try to access it via

...mapState({
Info: 'modules/general/info'
Pages: 'modules/general/pages'
})

Return undefined

When i use

...mapState({
modules: 'modules'
})

this return all my substates plz help

• javascript
• vue.js
• vuex
• nuxt.js

2 Answers 2

Try to map the state twice for both info, pages states like,

puted: {
    ...mapState('modules/general/info', ['get_info']),
    ...mapState('modules/general/pages', ['get_pages']) 
}

Another way you can map the states like,

puted: {
  ...mapState('modules/general', {
    info: state => state.info,
    pages: state => state.pages
  })
},

Refer Binding-helpers-with-namespace

The following code should help you on your way to only get the state you actually wants, instead of all of the states on the store.

From this approach, it means that you should have your store attached to Vue already, but i guess you already have from the code you're showing.

You might have to swap 'general' with 'modules/general'

puted: {
  ...mapState('general', {
    info: state => state.info
  })
}