In my puted, I have two "loading" states that I want to track. Is there a way to add an alias to the other state with this syntax?

  puted: {
    ...mapState('barcodes', ['barcodes', 'loading', 'pagination']),
    ...mapState('users', ['user', 'loading']), // add an alias for this "loading"
  }

In my puted, I have two "loading" states that I want to track. Is there a way to add an alias to the other state with this syntax?

  puted: {
    ...mapState('barcodes', ['barcodes', 'loading', 'pagination']),
    ...mapState('users', ['user', 'loading']), // add an alias for this "loading"
  }

• javascript
• vue.js
• vuejs2
• vuex

Share Improve this question Follow asked Oct 25, 2021 at 7:39 patrick_starpatrick_star 7311 silver badge66 bronze badges

Add a ment  | 

2 Answers 2

Sorted by: Reset to default 4

mapState has supported an object way, something like: (Specific alias for only 1 field)

puted: {
  ...mapState('barcodes', {
    barcodesLoading: state => state.loading,
  })
}

Or by namespace: (If you want to wrap all user state into the userData namespace)

puted: {
  ...mapState({
      barcodeData: 'barcodes',
      userData: 'users'
  })
}

on Template:

<div>{{barcodeData.loading}}</div>

There is another thread for your reference:

vuex namespaced mapState with multiple modules

I'm not absolutely sure, because I can't check it out right now. But AFAIK you should just try this:

puted: {
    ...mapState('barcodes', {barcodes:'barcodes', alias1:'loading', pagination:'pagination'}),
    ...mapState('users', {user:'user', alias2:'loading'}), // add an alias for this "loading"
  }

I.e. use object instead of array.