Vuex-基本介绍

2022-12-22 0 964

Vuex是甚么

Vuex是两个专门针对Vue.js应用领域软件开发的状况管理工作组件,选用封闭式repeats工作应用领域的大部份组件的状况,

化解多组件统计网络设备。

关键点:

1.Vue非官方配搭,专用选用(近似于:vue-router),有专门针对的增容辅助工具

2.封闭式管理工作统计数据状况计划(操作方式更简约)data(){return{统计数据,状况}}

3.统计数据变动是可预估的(积极响应式)

vue非官方提供更多的分立于组件管理体系以外的,管理工作公共统计数据的辅助工具

选用情景通常用于项目投资,数个组件间的统计资源共享资源

能把大部份的统计数据,全放到vuex中?

无法。只如果放须要共享资源的统计数据(前台管理工作系统中:帐号,所处职能部门……)

Vue5个文本须要自学:

1.state:标准化表述公共统计数据(近似于data(){return {a:1,b:2,xxxx}})

2.mutations:选用它来修正统计数据(近似于methods)更动state中的统计数据要选用mutations来展开更动

3.getters:近似于computed(排序特性,对原有的状况展开排序获得捷伊统计数据——–衍生)

4.actions:发动触发器允诺

5.modunles:组件分拆

最重要的文本是state和mutations

state

作用:保存公共统计数据

mutations

作用:修正公共统计数据

表述:

new Vuex.store({ state:{}, mutations: { xxxx: function(state, 形参){ state.xxxxx = 形参 } })

操作方式:

在组件中修正公共统计数据

this.$store.commit(mutations名字, 参数) this.$store.commit({type: mutations名字, p1:value1, p2:value2})

getters

作用:

对state中的统计数据展开加工,获得新统计数据(近似于排序特性)

格式:getters : { getter的名字(state) { return xxxx} }

访问

this.$store.getters.XXXX

通常应用领域于总价

actions

作用:做触发器操作方式来修正统计数据的

格式:

actions : { actions的名字(context, 参数) { 触发器操作方式;context.comit(mutation)} }

关键点:

它是通过调用mutations来修正统计数据的

访问:

this.$store.dispatch(actions的名字)

应用领域:ajax取回统计数据,通过mutation保存到state中

modules

作用:

分拆组件,把复杂的统计数据拆成两个两个分立的小组件

格式:

{modules: {组件1:{state: {}, actions: {}, getters: {}, mutations: {}} }}

操作方式:

访问组件中的统计数据

this.$store.组件名.统计数据

操作方式统计数据

不加namespaced:true

this.$store.commit(mutations的名字)

加了之后

this.$store.commit(组件名/mutations的名字)

关键点:

namespaced: true

相关文章

发表评论
暂无评论
官方客服团队

为您解决烦忧 - 24小时在线 专业服务