Vuex 操作不适用于 Nuxt 提取中的命名空间

Question

我正在构建自己的小项目。当我尝试从 nuxt fetch 方法中的主存储（index.js）访问状态时，一切正常，但是当我尝试从命名空间（store/photos.js）存储访问时，它不会工作。这是我的代码。

store/index.js（有效）

export const state = () => ({
    fetchedData: []
})


export const mutations = {
    setData: (state, data) => {
        state.fetchedData = data;
    }
}

export const actions = {
    async get(vuexContext) {
        const requestedData = await this.$axios.get("https://jsonplaceholder.typicode.com/users");
        vuexContext.commit('setData', requestedData.data);
    },
}

我的组件：

<script>
import { mapState, mapActions } from 'vuex'
export default {
  
  async fetch({ error,store })
  {
    try {
      await store.dispatch('get');
    } catch (error) {
      console.log(error);
    }   
  },
  computed: {
    ...mapState(['fetchedData'])
  }
};
</script>

store/photos.js（不起作用）

export const state = () => ({
  list: []
});

export const mutations = {
  setPhotos(state, data) {
    state.list = data;
  }
};

export const actions = {
  async getPhotos(vuexContext, context) {
    const requestedData = await this.$axios.get(
      "https://jsonplaceholder.typicode.com/photos"
    );
    vuexContext.commit("setPhotos", requestedData.data);
    
  }
};

相同的组件但已修改

<script>
import { mapState, mapActions } from 'vuex'
export default {
  
  async fetch({ error,store })
  {
    try {
      await store.dispatch('photos/getPhotos');
    } catch (error) {
      console.log(error);
    }      
  },
  computed: {
    ...mapState({
      list : 'photos/list'
    })
  }
};
</script>

提前致谢。

Answer 1

 namespaced: true,

您可以将其添加到您的 index.js 文件中。希望这会奏效。

参考链接： Try this