vuex actions传递多参数的处理方法


Posted in Javascript onSeptember 18, 2018

场景

在使用vue components dispatch Vuex actions的时候需要传递参数给多个参数actions

但是在actions 只是可以接收到两个参数的问题

分析

vuex actions 固定接受的第一个参数是dispatch对象 第二个参数是使用者本身定制的参数

参考

`https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Operators/Destructuring_assignment`

解决

调用的时候 第二个参数传递成多个元素的对象这样在actions 中第二个参数就可以搞定了

this.$store.dispatch('delTask', {task, index});

actions使用ES2015参数解析

delTask : function (store, {index, task}) {
   let url = 'http://zhihu.carsonlius_liu.cn/api/tasks/' + task.id;
   Http.$http.delete(url).then(function (response) {
    if (response.body.status === 'success') {
     store.commit('delSpecialTask', index);
    }
   });
  }

以上这篇vuex actions传递多参数的处理方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jQuery.Autocomplete实现自动完成功能(详解)
Jul 13 Javascript
使用 JScript 创建 .exe 或 .dll 文件的方法
Jul 13 Javascript
JavaScript中的字符串操作详解
Nov 12 Javascript
jQuery实现的漂亮表单效果代码
Aug 18 Javascript
jQuery CSS3自定义美化Checkbox实现代码
May 12 Javascript
jQuery+ajax简单实现文件上传的方法
Jun 03 Javascript
详解webpack import()动态加载模块踩坑
Jul 17 Javascript
基于vue.js组件实现分页效果
Dec 29 Javascript
微信小程序 调用微信授权窗口相关问题解决
Jul 25 Javascript
Vue打包部署到Nginx时,css样式不生效的解决方式
Aug 03 Javascript
VUE 实现element upload上传图片到阿里云
Aug 12 Javascript
【js设计模式】SOLID五大设计原则
Mar 24 Javascript
微信小程序搭建(mpvue+mpvue-weui+fly.js)的详细步骤
Sep 18 #Javascript
详解关于Vue2.0路由开启keep-alive时需要注意的地方
Sep 18 #Javascript
Vue中 key keep-alive的实现原理
Sep 18 #Javascript
vue服务端渲染页面缓存和组件缓存的实例详解
Sep 18 #Javascript
从Vuex中取出数组赋值给新的数组,新数组push时报错的解决方法
Sep 18 #Javascript
vue服务端渲染添加缓存的方法
Sep 18 #Javascript
在Vuex使用dispatch和commit来调用mutations的区别详解
Sep 18 #Javascript
You might like
dedecms模版制作使用方法
2007/04/03 PHP
php FPDF类库应用实现代码
2009/03/20 PHP
Yii2框架视图(View)操作及Layout的使用方法分析
2019/05/27 PHP
thinkphp框架类库扩展操作示例
2019/11/26 PHP
JS中不为人知的五种声明Number的方式简要概述
2013/02/22 Javascript
NodeJS url验证(url-valid)的使用方法
2013/11/18 NodeJs
javascript获取URL参数与参数值的示例代码
2013/12/20 Javascript
js对象内部访问this修饰的成员函数示例
2014/04/27 Javascript
jQuery实现的多屏图像图层切换效果实例
2015/05/07 Javascript
javascript倒计时效果实现
2015/11/12 Javascript
webpack中引用jquery的简单实现
2016/06/08 Javascript
jQuery学习笔记之回调函数
2016/08/15 Javascript
AngularJS之页面跳转Route实例代码
2017/03/10 Javascript
详解nodejs微信公众号开发——6.自定义菜单
2017/04/13 NodeJs
jquery在vue脚手架中的使用方式示例
2017/08/29 jQuery
vue使用drag与drop实现拖拽的示例代码
2017/09/07 Javascript
详解Node全局变量global模块
2017/09/28 Javascript
vue2.0与bootstrap3实现列表分页效果
2017/11/28 Javascript
vue中简单弹框dialog的实现方法
2018/02/26 Javascript
JavaScript中set与get方法用法示例
2018/08/15 Javascript
小程序实现上传视频功能
2020/08/18 Javascript
详解ES6中class的实现原理
2020/10/03 Javascript
搞笑的程序猿:看看你是哪种Python程序员
2015/06/12 Python
对python pandas 画移动平均线的方法详解
2018/11/28 Python
详解Python安装tesserocr遇到的各种问题及解决办法
2019/03/07 Python
python定位xpath 节点位置的方法
2019/08/27 Python
Python基础之变量基本用法与进阶详解
2020/01/03 Python
Selenium元素定位的30种方式(史上最全)
2020/05/11 Python
基于Python爬取股票数据过程详解
2020/10/21 Python
移动Web—CSS为Retina屏幕替换更高质量的图片
2012/12/24 HTML / CSS
基于HTML5的WebGL实现json和echarts图表展现在同一个界面
2017/10/26 HTML / CSS
台湾森森购物网:U-mall
2017/10/16 全球购物
公共艺术专业自荐信
2014/09/01 职场文书
导游词之镇江-金山寺
2019/10/14 职场文书
Python离线安装openpyxl模块的步骤
2021/03/30 Python
SQL实现LeetCode(178.分数排行)
2021/08/04 MySQL