2月7号，官网更新Vue3作为默认版本，而官网也确定对Vuex不再接收新功能，取而代之的是Pinia，但我们还是要了解下Vuex的。
1. State
单一状态树：一个应用将只有一个Store，它还可以分割为模块化也就是Modules。
在组件中获取Vuex的状态
store实例中获取，const store = Vuex.Store({})我们先创建了store实例，可以在计算属性中直接返回所想要的数据，return store.state.xx,一旦数据变化，计算属性会重新计算，并更新dom。
但这样我们每次都要调用这个store实例，解决方法就是将其注入到Vue实例中new Vue({el: '#app',store})，我们就可以通过this.$store来直接访问了，而且它注入了根组件中，之后的子组件都可以直接使用这种方式访问。
mapState辅助函数
当你有多个状态属性，要一个一个声明函数式去写，太麻烦了，可以用mapState辅助函数传入配置对象，每个属性，会以this.xx(属性)映射成store.state.xx，对于方法最好还是常规式，不用箭头函数。
当属性与state的子节点名字一致，可以直接用数组式。
扩展运算符...
对于有属性的可以直接使用，方法要独立放置在外部。
2. Getters（精）
Getters就好像computed一样，它是负责store的计算就是一个共享函数一般。
getters的返回值依赖于store的state，会被缓存起来，当依赖改变，会被重新计算。
想要获取getters的值可以：
- 通过属性访问
store.getters对象
Getter接收第一个参数为state。第二个参数为getters，没错就是它自己。如此你便可以读取它'其他的计算属性'
在组件中我们要读取它的值就可以直接this.$store.getters.xx
- 通过方法访问
让getter返回一个函数，例如：getbyid:(state)=>{return function(id){return}}
这样的访问方式，不会缓存结果，因为是调用的，函数被调用完会释放stack调用栈。
- Vuex.mapGetters辅助函数
仅仅将store中的getter映射到局部计算属性 例如:
getters:{
donetodo: state => {
return state.todos.filter((todo)=>todo.done)
},
donetodolength: (state,getters) => {
return getters.donetodo.length
},
gettodobyid:(state)=>
(id)=>{
return state.todos.find(todo => todo.id === id)
}
}
我们有2条方法。那么可以将其映射到组件的computed中去
computed:{
...mapGetters([
'donetodo',
'donetodolenght',
]),
gettodobyid(){
return this.$store.getters.gettodobyid(2)
}
}
由于第三条返回的是一个函数所以不可以。
你还可以使用对象形式另取一个名字
...mapGetters({
// 把 `this.doneCount` 映射为 `this.$store.getters.doneTodosCount`
doneCount: 'doneTodosCount'
})
