来自非 index.js 存储文件的 mapGetters

Question

例如，

我想映射 store/app.js 文件中的 getters。我在这个文件中有一个 sidebar() getter。在我的组件文件中，我调用：

export default {

  // ...

  computed: {
    ...mapGetters({
      sidebar: 'app/sidebar'
    }),

    // ...

    isCollapse() {
      return !this.sidebar.opened
    }
  }
}

但是好像不行，我收到了TypeError: Cannot read property 'opened' of undefined

store/app.js:

// ...

export const state = () => ({
  sidebar: {
    opened: true
  }
})

export const mutations = {
  // ...
}

export const actions = {
  // ...
}

export const getters = {
  sidebar(state) {
    return state.sidebar
  }
}

Answer 1

我对nuxt不熟悉，所以这只是一个想法。

我没有发现您的设置有任何问题。粗略地看一下 https://nuxtjs.org/guide/vuex-store 意味着可能需要一个你没有提到的 store/index.js 文件。

如果这不起作用，我建议将其添加到您的组件中以帮助调试：

created() {
  console.log(this.$store); // <-- this is the vuex store accessed by the component
}

来自非 index.js 存储文件的 mapGetters

mapGetters from not an index.js store file

store

vue.js

vuex

nuxt.js