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} /> 
    } 
}

来源

2016-02-29 Liam Schauerman

你怎么知道teamReducer函数从未被调用？你的代码在第一次看起来看起来很好，你应该在你的Home组件内注入'this.props.called'。 – Kocur4d

将Home.render（）的返回值更改为'

{this.props.called ? CALLED : null}

'最初应该有按钮，但是当您单击它时，您也应该获得一个跨度。 - 这只是为了测试或粘贴调试器在减速器的一侧，如果你在铬。 – Kocur4d

我知道reducer没有被调用，因为我有switch.action（action.type）之上的console.log（action）...这个console.log没有触发。当我将我的代码移至SO时，这被遗漏了。当我回家时，我会尝试你的建议。谢谢！ –

该问题在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} /> 
}

来源

2016-03-01 14:48:26

谢谢！我今晚会尝试这个修复 –

React Redux-我的动作创建器没有将动作传递给reducer（sync）

回答

相关问题