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）

回答

相關問題