Vuex 中 使用 Action 处理异步请求时,常规写法如下:

   getMenuAction:(context) =>{
context.commit('SET_MENU_LIST',['承保2','核保2'])
}
}

  我们也可以使用如下简化写法,如下:

   actions:{
getMenuAction:({commit}) =>{
commit('SET_MENU_LIST',['承保2','核保2'])
}
}

  这是一种怎么的写法呢?

  其实这是 ES6 中一种被称为  变量解构赋值  新的语法知识,可参考我的另外一篇文章  变量解构赋值。

     我们可以看看  Vuex 中 注册 Action的源码如下:

  

  

  常规写法中的 context = {   dispatch: local.dispatch,
                     commit: local.commit,
                getters: local.getters,
                state: local.state,
                rootGetters: store.getters,
                rootState: store.state                         }

  使用 变量解构赋值后 { commit } 的 commit= context.commit 了。

  

Vuex- Action的 { commit }的更多相关文章

  1. vuex action 与mutations 的区别

    面试没说清楚.这个太丢人回来整理下: 事实上在 vuex 里面 actions 只是一个架构性的概念,并不是必须的,说到底只是一个函数,你在里面想干嘛都可以,只要最后触发 mutation 就行.异步 ...

  2. 如何在 vuex action 中获取到 vue 实例

    问题:在做运营开发工具的时候 我想要请求后台服务器保存成功后 弹出一个弹框(饿了吗 的 message 弹框), 由于$message 是挂在 Vue原型链上的方法 (Vue.prototype.$m ...

  3. VUEX action解除页面耦合

    最近项目中需要用到vue+vuex来实现登出跳转功能,老大指派任务要用action解除页面耦合,刚从vue深渊晕晕乎乎爬出来的我是一脸懵逼啊...啥是解除耦合...网上vuex的资料太少了,vuex手 ...

  4. vuex——action,mutation,getters的调用

    一.子模块调用根模块的方法 mutation调用  context.commit('clearloginInfo',{key_root:data},{root:true}); action调用  co ...

  5. vue-x action 的相互调用

    实现方式:分发 Action Action 通过 store.dispatch 方法触发: store.dispatch('increment')

  6. vuex mutation,action理解

    1. 在store中分别注册mutation和action,action中用commit同步调用mutation来执行修改state,但是在组件中则使用dispatch异步调用action 2. 通俗 ...

  7. Vuex 模块化与项目实例 (2.0)

    Vuex 强调使用单一状态树,即在一个项目里只有一个 store,这个 store 集中管理了项目中所有的数据以及对数据的操作行为.但是这样带来的问题是 store 可能会非常臃肿庞大不易维护,所以就 ...

  8. Vue全家桶(Vue-cli、Vue-route、vuex)

    摘要 学习本篇之前要具备一定的vue基础知识,可以先看一下Vue基础(环境配置.内部指令.全局API.选项.内置组件) 1.Vue-cli Vue-cli是vue官方出品的快速构建单页应用的脚手架,这 ...

  9. vuex2.0 基本使用(2) --- mutation 和 action

    我们的项目非常简单,当点击+1按钮的时候,count 加1,点击-1按钮的时候,count 减1. 1, mutation The only way to actually change state ...

  10. vuex 的基本使用之Module

    Module 首先介绍下基本的组件化规则:你可以根据项目组件的划分来拆分 store,每个模块里管理着当前组件的状态以及行为,最后将这些模块在根 store 进行组合. const moduleA = ...

随机推荐

  1. 直播一:H.264编码基础知识详解

    一.编码基础概念 1.为什么要进行视频编码? 视频是由一帧帧图像组成,就如常见的gif图片,如果打开一张gif图片,可以发现里面是由很多张图片组成.一般视频为了不让观众感觉到卡顿,一秒钟至少需要16帧 ...

  2. Hbuilder app开发,使用mui.ajax和服务器交互,后台获取不到值,显示null的解决方法

    先上一个能用的js代码: function login() { var uname=document.getElementById("username").value.trim() ...

  3. 记录一次参加D2前端技术论坛的杭州之行

    前言 在这里,闰土首先要感谢以下两位大佬提供的门票,分别是来自新浪微博部门的H同学,以及来自小米科技的D同学. 当我周六晚上在青旅写完这篇文章过后,第二天上网发现,已经有大佬提前一步在掘金上发布了高质 ...

  4. 》》canvas时钟

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  5. cocos2d-x 托付模式的巧妙运用——附源代码(一)

    先来说一下托付模式是什么.以下的内容摘要自维基百科: 托付模式是软件设计模式中的一项基本技巧.在托付模式中,有两个对象參与处理同一个请求.接受请求的对象将请求托付给还有一个对象来处理.托付模式是一项基 ...

  6. Node.js显示页面

    首先我们先要下载并安装Nodejs,然后进入Node.js中安装supervisor, npm -g install supervisor -g表示全局模式 (无论windows哪一个用户登陆都可以使 ...

  7. vue从入门到女装:从零开始搭建后台管理系统(一)安装框架

    安装及运行都是基于node的,不会node的可以自行百度,网上教程很多,也不难 项目效果预览: demo1 demo2 源码下载 开始安装框架: vue ==>vue-cli安装   eleme ...

  8. Android Spinner值不显示,选择列表正常

    你在给adapter设置数据时,如果你是静态数据,也就是死数据,那么spinner显示没有问题,但是你如果异步进行网络请求,或者使用Volley请求的时候就要注意,你的adapter设置要在onRes ...

  9. iOS cocos2d游戏引擎的了解之一

    ios游戏引擎之Cocos2d(一) cocos2d是一个免费开源的ios游戏开发引擎,并且完全采用object-c进行编写,这对于已经用惯object-c进行ios应用开发的童鞋来说非常容易上手.这 ...

  10. 520. Detect Capital

      Given a word, you need to judge whether the usage of capitals in it is right or not. We define the ...