React Redux-我的动作创建器没有将动作传递给reducer(sync)
问题描述:
当我单击Home容器中的DIV时,我已确认设置的函数被调用(我看到控制台日志) teamReducer函数永远不会被调用。也许bindActionCreators应该以不同的方式使用?我如何让我的动作创造者向Reducer发送动作来更新联盟商店?React Redux-我的动作创建器没有将动作传递给reducer(sync)
// teamReducer.js
export function teamReducer(state = initialState, action){
switch (action.type) {
case 'SET_TEAM':
return {
...state,
called: true
};
default:
return state;
}
};
// reducers/index.js
import { combineReducers } from 'redux';
import { routeReducer } from 'redux-simple-router';
import { teamReducer } from './teamReducer';
const rootReducer = combineReducers({
routing: routeReducer,
league: teamReducer,
});
export default rootReducer;
// actions/setTeam.js
export function setTeam(team, position) {
console.log(team, position);
return {
type: 'SET_TEAM',
team,
position
};
}
}
// Home.js
import React, { PropTypes, Component } from 'react';
import { bindActionCreators } from 'redux';
import { connect } from 'react-redux';
import {setTeam } from '../../actions/teams';
const mapStateToProps = ({league}) => {
return {
called: league.called
};
};
const mapDispatchToProps = (dispatch) => {
return bindActionCreators({
setTeam,
}, dispatch);
};
@connect(mapStateToProps, mapDispatchToProps)
export class Home extends Component {
constructor(props) {
super(props);
}
render() {
const {set} = this.props.setTeam
return <div onClick={set} />
}
}
答
该问题在render
函数中。你使用解构赋值错误。
render() {
const {set} = this.props.setTeam;
return <div onClick={set} />
}
这种分配是一样的,在下面的代码:
const set = this.props.setTeam.set;
但setTeam
是一个函数,没有set
财产。正确的代码是:
render() {
const {setTeam} = this.props;
return <div onClick={setTeam} />
}
+0
谢谢!我今晚会尝试这个修复 –
你怎么知道teamReducer函数从未被调用?你的代码在第一次看起来看起来很好,你应该在你的Home组件内注入'this.props.called'。 – Kocur4d
将Home.render()的返回值更改为'
我知道reducer没有被调用,因为我有switch.action(action.type)之上的console.log(action)...这个console.log没有触发。当我将我的代码移至SO时,这被遗漏了。当我回家时,我会尝试你的建议。谢谢! –