Vue.js Vuex映射状态在组件中始终未定义

我有一个名称空间的Vuex存储模块，我正在尝试访问组件中该模块的状态（通过mapState）以在数据中设置默认值。但是，“映射状态”在我的组件中始终是未定义的

我的店铺是：

cartDetail.js

export const defaults = {
  id: null,
  items: [],
},
const state = { ...defaults, };
export default {
  namespaced: true,
  state,
}

在我的组件中，我有：

<script>
 import { mapState, mapActions, } from 'vuex';

 data() {
    defaultSelected: this.cartDetail.items[0],
 },

 computed () {
  ...mapState('cartDetail', ['cartDetail,'],),

  setDefaultSelected () {
   return this.cartDetail.items[0];
  },
 },

 created () {
    this.cartFetch(userId);
 }
</script>

从“vuex”导入{mapState，mapActions，}；
数据（）{
defaultSelected:此.cartDetail.items[0]，
},
计算（）{
…mapState（'cartDetail'，['cartDetail'，]，），
setDefaultSelected（）{
返回此.cartdail.items[0]；
},
},
创建（）{
this.cartFetch（userId）；
}

甚至当我

console.log（this.cartdail）时在my
setDefaultSelected
computed或created hook中，它是未定义的！任何帮助都将不胜感激

您的数据部分看起来不正确。应该是这样的：
在mapState中，您应该指出状态道具（如果它们不是来自根状态，那么还应该指明它们的模块名称）。我假设carDetail.js是一个存储模块
data() {
    return {
      defaultSelected: this.items[0]
    }
 },


computed () {
  ...mapState({
     id: state => state.cartDetail.id,
     items: state => state.cartDetail.items
  }),

  setDefaultSelected () {
   return this.items[0];
  },
 },