Vuex状态管理库

状态管理库vuex

         Vuex是一个专为Vue.js应用程序开发的状态管理库。状态就是指组件之间共享的数据

         vue项目中配置状态管理库vuex的流程

                  1.下载并引入vuex相关内容

                  2.创建状态管理库对象store

                  3.对外抛出store对象

                  4.在main.js中将store对象与当前项目相关联

         store状态管理库重要组成部分

                  state:组件之间共享的数据集合

                          组件中获取方法

                                   1.直接获取

this.$sotre,state.user

                                   2.使用对象含开运算符的形式

...mapState(['count','user'])

                  getters:相当于store对象计算属性(主要用于对state的数据进行过滤)

                          组件中获取方法

                                   1.直接获取

this.$store.getters.xxx;

                                   2.使用对象展开运算符的形式获取

...mapGetters(['xxx','xxx'])

                  mutation:定义了修改store对象中的state数据的同步方法(要修改的数据不是Ajax异步获取的)

                          组件中如何触发

                                   1.直接用commit触发

this.$store.commit('xxx','传递参数')

                                   2.使用对象展开运算符mapMutations的形式获取

...mapMutations(['xxx','xxx'])

                  actions:定义了修改state数据的异步方法(修改数据是Ajax获取的异步数据)

                          组件中如何触发

                                   1.直接用dispatch触发

this.$store.dispatch('xxx','传递参数')

                                   2.使用对下昂展开运算符mapActions的形式获取

...mapActions(['xxx','xxx'])

posted @ 2022-05-12 20:31  KimiRaikkonen  阅读(42)  评论(0)    收藏  举报