[Vuex]ヘルパー関数createNamespacedHelpersを複数のstoreから使う

createNamespacedHelpersの使い方に関してはこちらの記事をご参照ください。
[Vuex]ヘルパー関数createNamespacedHelpersの使い方

createNamespacedHelpersを複数のstoreから使用するには以下のように記述します。

Top.vue

<script>
import { createNamespacedHelpers } from 'vuex'

const { mapState, mapActions } = createNamespacedHelpers('hoge/Hoge')  // Hoge.jsのStateとActionsを使う
const {
  mapState: mapStateOfFuga,
  mapActions: mapActionsOfFuga
} = createNamespacedHelpers('fuga/Fuga')  // Fuga.jsのStateとActionsを使う

export default {
  computed: {
    ...mapState([
      'aaa',
      'bbb'
    ]),
    ...mapStateOfFuga(['xxx'])
  },
  methods: {
    ...mapActions([
      'ccc',
      'ddd'
    ]),
    ...mapActionsOfFuga(['yyy'])
  }
}
</script>

このようにFugaのstoreを参照する時には、
mapState: mapStateOfFuga
のように名前をつけて定義しました。
これをせず、Hogeと同じようにmapStateだけで使ってしまうと、
Hogeのstoreを参照するのかFugaのstoreを参照するのか分からずエラーとなります。

また、今回はHogeのstoreは名前をつけずに使いましたが、
Fugaと同じように名前をつけて使用しても全く問題ないです。