Vuex - динамические пространства имен в помощниках связывания (mapState, ...)

Question

Я динамически регистрирую модули магазина vuex

store.registerModule('home.grid', GridStore)

затем в компоненте:

export default {
name: 'GridComponent',

props: {
  namespace: {
    type: String,
    required: true
  },

 computed: {
    ...mapState(this.namespace, ['filter']) // doesn't work
    filter() { // more verbose but working
      return this.$store.state[this.namespace].filter
    }
 }
 ...

Но я получил ошибку:

Невозможно прочитать свойство 'namespace' из неопределенного

Есть идеи?

вопрос, изначально задаваемый из "gabaum10" здесь https://forum.vuejs.org/t/vuex-dynamic-namespaces-in-mapstate-mapactions/28508

Answer 1

Решено здесь https://github.com/vuejs/vuex/issues/863#issuecomment-329510765

{
  props: ['namespace'],

  computed: mapState({
    state (state) {
      return state[this.namespace]
    },
    someGetter (state, getters) {
      return getters[this.namespace + '/someGetter']
    }
  }),

  methods: {
    ...mapActions({
      someAction (dispatch, payload) {
        return dispatch(this.namespace + '/someAction', payload)
      }
    }),
    ...mapMutations({
      someMutation (commit, payload) {
        return commit(this.namespace + '/someMutation', payload)
      })
    })
  }
}

Answer 2

Я практически столкнулся с той же проблемой, связанной с созданием динамических геттеров, по какой-то причине вы не можете выполнять функции карты vuex с переменными данных из компонента.

Так что это не сработало для меня

 ...mapGetters( this.layout,['getFilterByObject'])

Но я мог бы сделать это

this.$store.getters[this.layout + '/getFilterByObject'](filterGroup)

Может быть, вы можете сделать что-нибудь. похоже с твоим состоянием, хотя я не проверял это

this.$store.state[this.namespace].filter