vuex

tech2024-12-04  11

**

vuex

** 一、什么是vuex

介绍:Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式。 理解:核心就是 store(仓库),仓库是用来干什么的?你就当它用来储存东西的。

二、我们什么时候应该用到Vuex呢?

1.小应用不建议使用Vuex,因为小项目使用 Vuex 可能会比较繁琐冗余; 2.中大型单页应用,因为要考虑如何更好地在组件外部管理状态,Vuex 将会成为自然而然的选择;

三、vuex里面都有些什么内容?

state:存储状态。也就是变量;getters:派生状态。也就是set、get中的get,有两个可选参数:state、getters分别可以获取state中的变量和其他的getters。外部调用方式:store.getters.personInfo()。就和vue的computed差不多;

用来从store获取Vue组件数据,类似于computed

mutations:提交状态修改。也就是set、get中的set,这是vuex中唯一修改state的方式,但不支持异步操作。第一个参数默认是state。外部调用方式:

事件处理器用来驱动状态的变化,类似于methods,同步操作

store.commit(‘SET_AGE’, 18)。和vue中的methods类似。actions:和mutations类似。不过actions支持异步操作。第一个参数默认是和store具有相同参数属性的对象。外部调用方式:store.dispatch(‘nameAsyn’)

可以给组件使用的函数,以此用来驱动事件处理器 mutations,异步操作

modules:store的子模块,内容就相当于是store的一个实例。调用方式和前面介绍的相似,只是要加上当前子模块名,如:store.a.getters.xxx()。

由于使用单一状态树,应用的所有状态会集中到一个比较大的对象。当应用变得非常复杂时,store 对象就有可能变得相当臃肿。

四、使用Vuex的好处?

1、多层嵌套的组件、兄弟组件间的状态会更好管理维护。 2、缓存一些当前要使用请求远程或本地的数据集(刷新后会自己销毁)。 3、有了第二条,就可以减少向服务器的请求,节省资源。如果你的用户足够多,那么每多出一个请求,对公司来说,都是一大笔钱。 4、对开发者来说,如果你的项目足够复杂,团队的规模也不仅是一个人,数据集中处理更利于程序的稳定和维护。

最新回复(0)