要执行vuex中的函数,有两种方法:

  1.commit,例如this.$store.commit("GETMODULESELECTLIST");    //mutations中的方法

  2.dispatch,例如 this.$store.dispatch("getModuleSelectList");      //actions中的方法

两者之间的区别在于:

  commit是提交执行mutations中的方法,Mutations 是修改数据的,必须同步。

  dispatch是提交执行actions中的方法,action 提交的是Mutations,可以是异步操作。action不可以修改store中的数据,需要commit mutation中的方法进行数据修改

当你的操作行为中含有异步操作,比如向后台发送请求获取数据,就需要使用action的dispatch去完成了。

  

vuex中mutations与actions的区别的更多相关文章

  1. vuex中mutations数据响应

    vuex中的mutation需遵守Vue的响应规则: 既然Vuex的store中的状态是响应式的,那么在我们变更状态时,监视状态的Vuex最好在state中初始化好所有的所需属性. 如果需要在对象上添 ...

  2. vuex中的辅助函数 mapState,mapGetters, mapActions, mapMutations

    1.导入辅助函数 导入mapState可以调用vuex中state的数据 导入mapMutations可以调用vuex中mutations的方法 四个辅助函数 各自对应自己在vuex上的自己 2.ma ...

  3. Vuex入门实践(中)-多module中的state、mutations、actions和getters

    一.前言 上一篇文章<Vuex入门实践(上)>,我们一共实践了vuex的这些内容: 1.在state中定义共享属性,在组件中可使用[$store.state.属性名]访问共享属性 2.在m ...

  4. 在vuex的mutations中使用vue的小技巧

    问题: 在vuex组件中的mutations属性中的定义的函数,有时会要用到vue这个对象.正常在其他的地方使用是通过this这个变量来获取,但是在mutations定义的函数中this指定的是Vue ...

  5. vuex(三)actions

    actions:既然mutations只能处理同步函数,我大js全靠‘异步回调’吃饭,怎么能没有异步,于是actions出现了...   actions和mutations的区别     1.Acti ...

  6. vue:vuex中mapState、mapGetters、mapActions辅助函数及Module的使用

    一.普通store中使用mapState.mapGetters辅助函数: 在src目录下建立store文件夹: ​ index.js如下: import Vue from 'vue'; import ...

  7. Vue Vuex state mutations

    Vuex 解决不同组件的数据共享,与数据持久化 1.npm install vuex --save 2.新建store.js 并引入vue vuex ,Vue.use(Vuex) 3.state在vu ...

  8. vue之mapMutaions的使用 && vuex中 action 用法示例 && api.js的使用

    vue之mapMutations的使用 我们通过Mutation来改变store中的state,方法往往是在子组件中使用 this.$store.commit(); 来实现,但是这样的缺点是不容易查看 ...

  9. vuex中module的命名空间概念

    vuex中module的命名空间概念 默认情况下,模块内部的 action.mutation 和 getter 是注册在全局命名空间的. 弊端1:不同模块中有相同命名的mutations.action ...

随机推荐

  1. KOA2框架原理解析和实现

    koa是一个基于node实现的一个新的web框架,从头实现一个koa框架,它是由express框架的原班人马打造的.它的特点是优雅.简洁.表达力强.自由度高.它更express相比,它是一个更轻量的n ...

  2. Django用户认证(四)自定义认证Customizing authentication

    原文:https://www.cnblogs.com/linxiyue/p/4061044.html 扩展已有的用户模型Extending the existing User model 有两种方法来 ...

  3. BA-Honeywell WEBsAX系统

  4. 为屏而生,为屏而死 - IT &quot;精英”们的杯与具

    为屏而生,为屏而死 - IT "精英"们的杯与具 太阳火神的漂亮人生 (http://blog.csdn.net/opengl_es) 本文遵循"署名-非商业用途-保持一 ...

  5. Web Service学习-CXF开发Web Service实例demo(一)

    Web Service是什么? Web Service不是框架.更甚至不是一种技术. 而是一种跨平台,跨语言的规范 Web Service解决什么问题: 为了解决不同平台,不同语言所编写的应用之间怎样 ...

  6. 从C到C++(下)

    继承 从一个类派生到另外一个类,使前者的所有特征在后者中自己主动可用. 他能够声明一些类型,这些类型能够共享部分或所有曾经所声明的类型.它也能够从超过一个的基类中共享一些特性. C++是支持多继承的. ...

  7. IOS开发教程--怎样使用点9图片

    事先准备一张图片: watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA== ...

  8. c5

    // // main.c // Switch练习2 // // Created by xiaomage on 15/6/6. // Copyright (c) 2015年 xiaomage. All ...

  9. xbox 相关

    https://live.xbox.com/zh-CN/avatareditor xboxgames://

  10. (转载)Android快速开发偷懒必备,一句话搞定所有ViewGroup的Adapter . 支持自定义ViewGroup

    [置顶] [Android]快速开发偷懒必备,一句话搞定所有ViewGroup的Adapter . 支持自定义ViewGroup 标签: androidAdapter快速开发0耦合 2016-12-1 ...