详解关于Vuex的action传入多个参数的问题


Posted in Javascript onFebruary 22, 2019

问题:

已知Vuex中通过actions提交mutations要通过context.commit(mutations,object)的方式来完成

然而commit中只能传入两个参数,第一个就是mutations,第二个就是要传入的参数

一开始遇到的问题是加入购物车方法中要传入一个字典对象里面保存产品信息item,还要传入一个产品数量的参数num

然而如果这么写的话就会报错:context.commit(mutations,item,num)

解决办法:

将第二个参数以对象的放式提交就像这样

mutations = {
  PRODUCT_ADDTO_CART:(state,product) => {
    //code
  }
}
actions = {
  productaddtocart:(context,value) => {
    context.commit('PRODUCT_ADDTO_CART', value);
  },
}

在页面调用方法的时候是这样的:

productAddToCart(item,productNum){
      this.productaddtocart({"item":item,"num":this.productNum})
}

这里的关键信息是将参数打包成一个字典对象传入,在mutations里面调用的话就product.item,product.num就解决了

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用js+xml自动生成表格的东西
Dec 21 Javascript
js+css在交互上的应用
Jul 18 Javascript
JS自动缩小超出大小的图片
Oct 12 Javascript
js实现的折叠导航示例
Nov 29 Javascript
JS弹出层的显示与隐藏示例代码
Dec 27 Javascript
AngularJS iframe跨域打开内容时报错误的解决办法
Jan 26 Javascript
JavaScript函数学习总结以及相关的编程习惯指南
Nov 16 Javascript
loading动画特效小结
Jan 22 Javascript
Node.js如何使用Diffie-Hellman密钥交换算法详解
Sep 05 Javascript
webpack 静态资源集中输出的方法示例
Nov 09 Javascript
实例详解vue中的$root和$parent
Apr 29 Javascript
从Node.js事件触发器到Vue自定义事件的深入讲解
Jun 26 Javascript
Vue.js实现开发购物车功能的方法详解
Feb 22 #Javascript
vue组件之间通信方式实例总结【8种方式】
Feb 22 #Javascript
vue2.0中set添加属性后视图不能更新的解决办法
Feb 22 #Javascript
浅谈Node框架接入ELK实践总结
Feb 22 #Javascript
vue工程全局设置ajax的等待动效的方法
Feb 22 #Javascript
JavaScript数据结构与算法之检索算法示例【二分查找法、计算重复次数】
Feb 22 #Javascript
详解基于iview-ui的导航栏路径(面包屑)配置
Feb 22 #Javascript
You might like
php&java(一)
2006/10/09 PHP
phpMyAdmin 安装教程全攻略
2007/03/19 PHP
php使浏览器直接下载pdf文件的方法
2013/11/15 PHP
php实现按文件名搜索文件的远程文件查找器
2014/05/10 PHP
php中的动态调用实例分析
2015/01/07 PHP
PHP中如何使用session实现保存用户登录信息
2015/10/20 PHP
thinkPHP5.0框架验证码调用及点击图片刷新简单实现方法
2018/09/07 PHP
js 发个判断字符串是否为符合标准的函数
2009/04/27 Javascript
url 特殊字符 传递参数解决方法
2010/01/01 Javascript
JavaScript 10件让人费解的事情
2010/02/15 Javascript
setTimeout和setInterval的区别你真的了解吗?
2011/03/31 Javascript
JavaScript 验证码的实例代码(附效果图)
2013/03/22 Javascript
jQuery 回车事件enter使用示例
2014/02/18 Javascript
js实现简单div拖拽功能实例
2015/05/12 Javascript
Javascript 普通函数和构造函数的区别
2016/11/05 Javascript
js生成随机颜色方法代码分享(三种)
2016/12/29 Javascript
微信小程序 下拉菜单的实现
2017/04/06 Javascript
React key值的作用和使用详解
2018/08/23 Javascript
vue实现多个元素或多个组件之间动画效果
2018/09/25 Javascript
python调用java的Webservice示例
2014/03/10 Python
python模块之paramiko实例代码
2018/01/31 Python
Python常见MongoDB数据库操作实例总结
2018/07/24 Python
Python根据文件名批量转移图片的方法
2018/10/21 Python
详解pytorch 0.4.0迁移指南
2019/06/16 Python
PyQt5图形界面播放音乐的实例
2019/06/17 Python
Python对称的二叉树多种思路实现方法
2020/02/28 Python
Python3基于print打印带颜色字符串
2020/07/06 Python
趣味游戏活动方案
2014/02/07 职场文书
超市促销活动方案
2014/03/05 职场文书
政治表现评语
2014/05/04 职场文书
亲戚关系证明
2015/06/24 职场文书
读《庄子》有感:美而不自知
2019/11/06 职场文书
Mysql 性能监控及调优
2021/04/06 MySQL
nginx作grpc的反向代理踩坑总结
2021/07/07 Servers
logback如何自定义日志存储
2021/08/30 Java/Android
据Python爬虫不靠谱预测可知今年双十一销售额将超过6000亿元
2021/11/11 Python