Vuex在组件中存储奇怪的行为

Question

可以直接在嵌入HTML的组件中以以下方式访问商店数据：

 {{$store.state.notificationArea.cart.total;}}

这很好用，但是，在与以下相同的控制器的计算属性中不起作用：

computed: {
 total: function () {
     return this.$store.state.notificationArea.cart.total;
  }
}

已经尝试解决了三天，请帮忙。

Answer 1

计算属性是一个返回值的函数，应将其声明为total:function(){}，total:()=>{}或total(){}：

computed: {
 total:()=>{
     return  this.$store.state.notificationArea.cart.total;  
   }
}

您要引用的属性应初始化为：

const state={
     notificationArea:{
                 cart:{
                    total:0,
                  }
            }
      }
....