Vuex中mutations与actions的区别与用法

一、区别

操作	描述
mutations	一般用于方法同步调用，修改vuex中state的状态。
actions	一般用于方法异步调用，多用于请求后台接口。

注：mutations 同步操作，不能写异步代码，用于将数据信息写在全局数据状态中缓存，不能异步操作。强行异步操作的话，可能将会引起数据失效。

二、用法

操作函数	直接使用
mutations 中的函数	this.$store.commit(“muFun”,params)
actions 中的函数	this.$store.dispatch(“acFun”,params)

操作函数	映射使用
mutations 中的函数	1、先是映射在methods中写 …mapMutations([“muFun1”,“muFun2”]) 2、后是调用 this.mufun1(params)
actions 中的函数	1、先是映射在methods中写 …mapActions([“acFun1”,“acFun2”])； 2、后是调用 this.acFun1(params)

vuex详细内容请参考官方文档

壁纸放送

Vuex中mutations与actions的区别与用法相关推荐

【手写 Vuex 源码】第五篇 - Vuex 中 Mutations 和 Actions 的实现
一,前言上一篇,主要介绍了 Vuex 中 getters 的实现,主要涉及以下几个点: 将选项中的 getters 方法,保存到 store 实例中的 getters 对象中: 借助 Vue 原生 ...
mutations vuex 调用_Vuex中mutations和actions的区别
Vuex 是一个专为 Vue.js 应用程序开发的状态管理模式.它采用集中式存储管理应用的所有组件的状态,并以相应的规则保证状态以一种可预测的方式发生变化 Mutation 更改 Vuex 的 sto ...
vuex基础mutations和actions
state数据的修改只能通过mutations,并且mutations必须是同步更新,目的是形成`数据快照` 数据快照:一次mutation的执行,**立刻**得到一种视图状态,因为是立刻,所以必须是 ...
Vuex中mutations的用法
Vuex中mutations的用法在 Vuex 中 store 数据改变的唯一方法就是提交 mutations.mutations里面装着一些改变数据方法的集合,这是Vuex 设计很重要的一点,就是 ...
js中几个对象的区别和用法
js中几个对象的区别和用法今天总结一下js中几个对象的区别和用法: 首先来说说 parent.window与top.window的用法 "window.location.href" ...
java caller_JavaScript中callee和caller的区别与用法实例分析
本文实例讲述了JavaScript中callee和caller的区别与用法.分享给大家供大家参考,具体如下: 1.callee 在函数的内部,有两个特殊的对象:arguments和this.其中arg ...
js中parentNode和parentElement的区别和用法
了解本篇的基础必须知道什么是节点,关于html dom节点知识点和节点类型的知识,分别看<js节点都有哪些类型?怎么判断是哪种节点类型?>和<js属性节点获取和移除>,下面直接 ...
javascript中call和apply的区别和用法
javascript中call和apply的区别和用法 1.call和apply是什么更改对象的内部指针指向,即改变对象的this指向的内容 function Fn(){this.name='小明' ...
VueX的mutations、actions
一.更改Vuex的store中的状态的唯一方法是提交mutation.Vuex中的mutation非常类似于事件:每个mutation都有一个字符串的事件类型和一个回调函数,这个回调函数就是我们实际进 ...

Vuex中mutations与actions的区别与用法

Vuex中mutations与actions的区别与用法相关推荐

最新文章

热门文章