状态管理库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-10 14:32  roastpork丸子龙  阅读(52)  评论(0)    收藏  举报