1

私は と一緒に使用してreact-router-reduxおりredux、このレポではすべてがうまく機能しています:react-routerreact

https://github.com/justsayno/redux-react-introduction-code/tree/issue-branch

issue-branch(私の問題を再現するためにブランチを見てください)

react-routerを使用して状態を redux 状態に統合し、react-router-reduxmapStateToProps を正常に使用して、employeeId次のように小道具から必要なルーターパラメーターを取得できます。

(以下はこのファイルから)

const mapStateToProps = (state, ownProps) => ({ 
    employeeId : ownProps.params.employeeId,
    employee: state.selectedEmployee.item,
    hasLoaded: state.selectedEmployee.hasLoaded,
    hasError: state.selectedEmployee.hasError,
    error: state.selectedEmployee.error
})

私のレンダー関数ではconsole.log(、employeeId は ${this.props.employeeId})であり、そのコンポーネントにルーティングするとパラメーターが変更されます。

しかし、理由がわかりませんが、パラメータが変更されたときにこれが起動しません。

componentWillReceiveProps(nextProps){
    console.log(nextProps)
}

私が達成しようとしているのは、従業員のリストと単一の従業員の異なるモック API 呼び出しです。employeeId パラメータが変更された場合、または従業員の 1 つしか表示されない場合は、従業員を再取得する必要があります。私は自分の関数でこれを行うつもりでしcomponentWillReceivePropsた。employeeId の変更を確認し、次のようになっている場合はアクションを開始します。

componentWillReceiveProps(nextProps){
    const { employeeId, selectEmployee } = this.props
    if(nextProps.employeeId !== employeeId){
        selectEmployee(nextProps.employeeId)
    }
}

私はこれに間違って近づいていますか?

4

1 に答える 1