题主在review 小萝卜丁 的vuex-shopping cart中vuex的写法。因为没系统研究过es6,所以想改写为自己更熟悉的写法,虽然没报错,但是不起效果,想了解一下应该怎么改写的。
...在es6里是展开符,或者能够分享一下这个展开的效果吗
小萝卜丁的action.js
export const changePrice = makeAction('CHANGE_PRICE')
export const changeStyle = makeAction('CHANGE_STYLE')
export const addItem = makeAction('ADD_ITEM')
export const removeItem = makeAction('REMOVE_ITEM')
function makeAction (type) {
return ({ dispatch }, ...args) => dispatch(type, ...args)
}
我自己的actionA.js
export const changePrice = ({ dispatch }) => {dispatch('CHANGE_PRICE')}
export const changeStyle = ({ dispatch }) => {dispatch('CHANGE_STYLE')}
export const addItem = ({ dispatch }) => {dispatch('ADD_ITEM')}
export const removeItem = ({ dispatch }) => {dispatch('REMOVE_ITEM')}
应该是这样的:
export const changePrice = ({ dispatch }, ...args) => dispatch('CHANGE_PRICE', ...args)
export const changeStyle = ({ dispatch }, ...args) => dispatch('CHANGE_STYLE', ...args)
export const addItem = ({ dispatch }, ...args) => dispatch('ADD_ITEM', ...args)
export const removeItem = ({ dispatch }, ...args) => dispatch('REMOVE_ITEM', ...args)
2个问题
一个是箭头函数后面有无{}
的区别
第二个问题时...args
必须照抄 要记得你返回的是一个函数 你现在写法函数只能处理一个参数了
action.js
"use strict";
function makeAction(type) {
return function (_ref) {
for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
args[_key - 1] = arguments[_key];
}
var dispatch = _ref.dispatch;
return dispatch.apply(undefined, [type].concat(args));
};
}
actionA.js
'use strict';
exports.__esModule = true;
var changePrice = exports.changePrice = function changePrice(_ref) {
var dispatch = _ref.dispatch;
dispatch('CHANGE_PRICE');
};
https://babeljs.io/repl/