如何使用Vuex中的state(公共数据)

一、使用全局的state

1.直接使用

(1).在组件中直接使用
  this.$store.state.属性名
(2).在模板中直接使用
  $store.state.属性名

2.map辅助函数

(1).不更改属性名使用
  computed:{
     ...mapState(['属性名称'])
  }
(2).更改属性名使用
  computed:{
   ...mapState({'新属性名称':'旧属性名称'})
  }
  

二、使用modules(模块化)的state

1.直接使用

(1).在组件中直接使用
this.$store.state.模块名.属性名
(2).在模板中使用
$store.state.模块名.属性名

2.使用map辅助函数调用

(1).不更改属性名使用
computed:{
   ... ...mapState('模块名',['属性名称'])
}
(2).更改属性名使用
computed:{
...mapState('模块名', {'新属性名称': '旧属性名称'})
}

小结---->state的作用:保存公共数据(多组件中公用的数据),可以轻松实现多组件之间的传值

小结---->state是响应式的： 如果修改了数据，相应的在视图上的值也会变化