问题
当访问某个数据项嵌套太深了，能不能优化一下访问的方式？
答：用mapState把公共数据（vuex.store） 映射 到本组件内部的计算属性中
map的作用就是:简化使用Vuex中state,getters,mutations,actions
map用法汇总
使用步骤:
1.在需要使用Vuex属性的组件中引入
// 1. 导入辅助函数mapState，它是在vuex中定义的一个工具函数。
// es6 按需导入 import { mapState } from 'vuex'
import { mapState } from 'vuex'
2.注册模块
2.1全局computed:{...mapState(["xxx"])}
2.2模块computed:{...mapState("模块名",["xxx"])}
3.模块使用直接调用,在export default中需要前面加this
4.## Vuex-辅助函数mapState对数据重命名
把中括号改为大括号,前面写"新名字":"模块名"
...mapState({'新名字': 'xxx'})
注意:
1.注册模块时是一个数组,如果需要引入多个可以直接逗号隔开
2.Vuex中state,getters需要写入组件computed中
3.mutations,actions需要写入组件methods中
代码如下:
// 1. 导入辅助函数mapState，它是在vuex中定义的一个工具函数。
// es6 按需导入 import { mapState } from 'vuex'
import { mapState } from 'vuex'
computed: {
// 说明1： ...对象 是把对象展开，合并到computed
// 说明2： mapState是一个函数
// ['数据项1'， '数据项2']
...mapState(['xxx'])，
...mapState({'新名字': 'xxx'})
}
使用
this.xxx
{{xxx}}
