我正在使用React-dnd与Redux结合使用但我无法发送动作。我的动作被调用,但永远不会调用reducer:
const spelSource = {
drop(props, monitor) {
updateD(monitor.getItem(), props.spel);
}
};
const mapDispatchToProps = {
updateD: (newS, oldS) => updateDeck(newS, oldS),
};
export default connect(
null, mapDispatchToProps
)(Spel)
Spel = DropTarget('spel', spelSource, collect)(Spel);
在我的行动中:
export function updateD(newS, oldS) {
console.log("update");
return function (dispatch) {
return dispatch({
type:"UPDATE_D",
newS: newS,
oldS: oldS
});
};
}
最后减速机:
case 'UPDATE_D':
return Object.assign({}, state, {
d: finalUpdate(state, action)
});
有没有办法派遣?谢谢!
您正尝试从操作中调度,但您需要Redux来自行调度操作。你的行动应该只返回一个带有type
属性和有效负载的对象(无论如何)。该动作由dispatch()
函数与connect()
函数包裹在mapDispatchToProps
函数中。传统上,你喜欢这样......
const mapDispatchToProps = dispatch => ({
updateD: (newS, oldS) => dispatch(updateDeck(newS, oldS))
});
有一些较短的方法来做这个in this article,但这是传统的方式。你可以看到connect()
函数接受了这个并将它传递给Redux商店的dispatch()
方法。
然后,您的操作将返回对象:
export const UPDATE_D = 'UPDATE_D';
export const updateD = (newS, oldS) => ({
type: UPDATE_D,
newS,
oldS
});
最后,你的减速机:
switch (action.type) {
case UPDATE_D:
return {
...state,
newS: action.newS,
oldS: action.oldS
};
default:
return state;
}
您需要使用this.props
从您的组件中正确分派该操作。
例如,在spelSource
,this.props.updateD(monitor.getItem(), props.spel)
可能是操作返回函数而不是对象的错误。而且这个内部函数永远不会被调用。
我希望看到类似的东西:
const mapDispatchToProps = dispatch => {
return {
updateD: (newS, oldS) => dispatch({
type:"UPDATE_D",
newS: newS,
oldS: oldS
})
}
}