props 中的值，在 mapState 中使用无法使用 Vue.js答案

【问题标题】：Value in props, using in mapState can not working Vue.jsprops 中的值，在 mapState 中使用无法使用 Vue.js
【发布时间】：2019-05-19 12:32:24
【问题描述】：

我想从 props 传递值并将其用作 mapState 中的 命名空间，然后它显示错误：'初始化应用程序类型错误时出错：无法读取未定义的属性'存储'' 这是我的代码：

父组件：<Editor store="store-test" />

子组件：

export default {
    props: ['store'],
    computed: {
        mapState(`${this.store}`, ['data'])
    }
}

但是我替换了this.store = store-test，我收到了我想要的数据。而且我不知道如何使用

...mapMutations({
  function() {
  }
})

是一样的

...mapState({
  data(state) {
    return state[this.store].data;
  },
})

【问题讨论】：

当我使用：...mapState('store-test', ['data']) 时，我在 Vue-devtool 中收到：data: []，但是当将store-test 替换为this.store 时，它失败了
啊，这是您尝试设置的 命名空间。你不能这样做，因为mapState 在定义时返回它的值，但道具只在运行时存在。
在此处查看mapMutations API ~ vuex.vuejs.org/api/#mapmutations。仅供参考，您可以使用mapMutations({ saveData (commit) { ... } })

标签： vue.js vuex

【解决方案1】：

因为mapState 在编译时为您的computed 定义返回其值，所以您不能使用props，因为它们仅在运行时分配。

你必须使用

computed: {
  data () {
    return this.$store.state[this.store].data
  }
}

如果你愿意，你仍然可以使用mapState，但是你不能使用 prop 值作为命名空间字符串

mapState({
  data1 (state) { // ? note: cannot be an arrow function
    return state[this.store].data1
  },
  data2 (state) {
    return state[this.store].data2
  }
})

【讨论】：

但我想从一家商店获得更多数据，你能要我吗？而是：return this.$store.state[this.store].data, return this.$store.state[this.store].data1 ...
对于任何需要通过动态 prop 模块名称访问的状态属性，都必须这样做。
@hieuphamba 我已经用一个不太冗长的替代方案更新了我的答案。希望对你有帮助
是的，我不能使用带有道具的 mapState 和你上面说的一样。但我不想使用this.$store.state[store].data 多个。谢谢您的回答。我想我会使用你的答案更新。谢谢！但我不标记接受，因为我认为你的回答让我觉得解决了大约 75% 的问题（鞠躬）
我有一个问题要问你，你可以找我吗？