为什么 Redux 存储显示我的状态，但反应组件说它未定义？

Question

我正在使用 react-redux 构建应用程序，但我的 redux 商店出现问题。我可以从 Redux devTools 中看到，当我单击 RenderPlayerTransferList 中的一个元素时，动作创建器被正确调用并且商店更新。但是，当尝试访问 this.props.currentSquad 时，反应组件本身 returns 未定义（由动作创建者更新的状态对象，然后我将其映射到道具）。有谁知道这是为什么？（注意我正在使用 redux thunk）

相关代码：

主要反应组件的相关代码：

handleTransferPlayerClick=(playerId)=>{

            if (this.props.selectedPlayerFromTeamSheet){
                this.props.addPlayerToSquad(playerId)


                //add new squad into playerIconProps

                this.playerIconProps.playerNames[this.props.selectedPlayerFromTeamSheet.iconKey] = this.props.players[this.props.currentSquad.newAdditions]
                console.log(this.playerIconProps)

            }
        }

const mapStateToProps=(state)=>{
    return {players:Object.values(state.playerDatabase),
            selectedPlayerFromTFLId:state.transfers.TFLPlayerId,
            selectedPlayerFromTeamSheet:state.transfers.selectedPlayer,
            currentSquad: state.squad
    }

}

export default connect(mapStateToProps, {getPlayers, selectPlayerFromTFL, selectPlayerFromTeamSheet, addPlayerToSquad})(Transfers)

动作创作者

export const addPlayerToSquad = (playerId)=>{

    return (dispatch, getState) => {
        const state = getState().transfers


        const payload = {currentSquadMemberId: state.selectedPlayer.iconKey, newSquadAdditionId: playerId}

        //recives object with playerId and Iconid t
        dispatch({type:ADD_PLAYER_TO_SQUAD, payload:payload})
    }
}

减速机


const squadDatabase = {currentSquad: {
    0: null,
    1: null,
    2:null,
    3:null,
    4:null,
    5:null,
    6:null,
    7:null,
    8:null,
    9:null,
    10:null,
    11:null,
    12:null,
    13:null,
    14:null,
    15:null
    }, newAdditions: null}

export default (state=squadDatabase, action)=>{

    switch(action.type){
        case ADD_PLAYER_TO_SQUAD:
            return {...state, currentSquad: {...state['currentSquad'], [action.payload.currentSquadMemberId]:action.payload.newSquadAdditionId}, newAdditions: action.payload.newSquadAdditionId}
        default:
            return squadDatabase
    }
}

reducers 组合在这里...

export default combineReducers ({
    // set state object to auth
    auth: authReducer,
    form: formReducer,
    playerDatabase: playerDatabaseReducer,
    transfers: transfersReducer,
    squad: squadReducer
})

Answer 1

没有运行它，您可能需要更改

return squadDatabase

至

return state

否则看起来该值将始终被硬编码？

并在 mapStateToProps 中更改

currentSquad: state.squad

至

currentSquad: state.squad.currentSquad

为什么 Redux 存储显示我的状态，但反应组件说它未定义？

Why does Redux store show my state, but react component says its undefined?

javascript

reactjs

redux

redux-thunk

react-redux