現在および次の小道具はcomponentWillReceivePropsで同じです

私はreduxの店舗変数を更新してコンポーネントに小道具として渡しますが、このコードでは現在の小道具と次の小道具は同じで、変更すると新しい小道具と同じですそれらを外部からの派遣を通じて現在および次の小道具はcomponentWillReceivePropsで同じです

componentWillReceiveProps (nextProps) { 
    console.log(this.props.data); 
    console.log(nextProps.data); 
}

どうしてですか？発送によって変更された場合、それらは全く異なるはずですか？公式docsによると

ディスパッチを非同期で呼び出していますか？もしそうなら、多分それがその一部になるかもしれない。また、IIFC componentWillReceivePropsは引数としてnextPropsのみを持ちます。 – rrd

私は、非同期のものが実行されているとは思わない。私は選択したボックスを持っています。これは、アクションを介して即座にストアの更新を行います。 –

@SergeiBasharov 'componentWillReceiveProps'がディスパッチアクションの後に複数回呼び出されている場合、少なくとも1回は異なる現在のプロンプトと次のプロップを記録する必要があります。 –

：が反応することが

注小道具ががを変更し、あなたがだけにしたい場合は、現在と次の値を比較することを確認していない場合でも、このメソッドを呼び出すことができます変更を処理します。 これは、親コンポーネントがコンポーネントにを再レンダリングさせる場合に発生することがあります。

少なくとも1組の異なる小道具（実際の変更）が表示されるはずですが、必ずしもすべてのログに表示される必要はありません。

2017-12-05 17:54:58

私の問題は、 'this.props.data'と' nextProps.data'の両方に新しい値があることです。したがって、データは適切に変更されますが、何らかの理由で変更前の現在の値が表示されません。 –

変更をディスパッチするとき、コンポーネントはすでにマウントされていますか？ 'componentWillReceiveProps'はマウント時にトリガしないので、小道具が変更されている可能性があります。 'componentWillMount'もログオンしてみてください。 –

これを試してみて、親ルートコンテナの 'componentWillReceiveProps'を見てみると、次の小道具と現在の小道具の両方を次の小道具と同じものとして表示します。 –

私は問題の核心を見つけました。

私は減速に私の現在の状態のクローンを作成するためにこれを使用する：現在の状態を変異しているように見えた

export const cloneDeep = (state) => ({...state});

どちら。私はこの1つに置き換え：変更した場合、現在の状態と現在の小道具への変更を行いません

export const cloneDeep = (state) => JSON.parse(JSON.stringify(state));

は今nextPropsに等しいではありません。

2017-12-06 10:29:07

そのコードの最初のバージョンは浅いクローンですが、2番目のバージョンは完全な新しいバージョンを作成していますが、状態の内容によっては使用するのが賢明で、非常に高価な呼び出しになる可能性があります循環参照で壊れている – Icepickle

最初のバージョンは現在の状態を突然変異させるべきなので、私は持っていた問題を引き起こしますか？ –

さて、浅いクローンなので、状態が持つ参照プロパティはすべて新しいオブジェクトにコピーされます（このことを参照してください：https://jsfiddle.net/hejfw8t1/） – Icepickle

答えて