vue-store

store

使用了vuex之后，自动绑定到vue实例上的数据，这个数据就是当前vuex仓库的实例对象。
数据存放到仓库，每个组件都可以拿来用。

1.如何将仓库中的state数据拿到组件中使用

1. 通过 this.$store.state.xxxx的方式 （不推荐）
2. 通过computed去取出仓库数据（推荐）
   ? 为什么使用仓库中的state数据需要computed中取出?
   !应为 state 中的数据不允许直接修改，用在computed中会更好，如果修改，会报错!
3. 使用 mapState() 这个辅助函数的方式 （更推荐）

mapState()

import {
   mapState} from 'vuex'

export default {
   
	//一、这种方式缺点，组件不能使用多个computed，去创建本地的computed，例如 姓-名 的合并。且在html中调用的时候不能修改名字，仓库中是什么就是什么
	computed:mapState(['仓库中的数据名'])

	// 二 
	computed:{
   
		// abc() 可以任意修改
		abc(){
   
			return this.$store.state.xxx(仓库中数据名)
		}
	}
	//三 ，需要使用多个computed的时候
	computed:{
   
    ...mapState(['xxx(仓库中数据名)']),
    fullName () {
   
      return this.firstName + ' ' +this.lastName
    }
  },
	
}

2.如何将仓库中getter数据拿到组件中使用

1. this.$store.getters.xxx 的方式 （不推荐）
2. 通过 computed 去仓库中取出 getter 的数据 （推荐）

代码部分

// 方法一

// 方法二
 computed:{
   
  	//直接调用 aaa
    aaa(