コンポーネントが更新された後、そのオブジェクトのプロパティ（小道具として！）が変更された場合にのみ関数を実行する方法はありますか？
元のオブジェクト：
const employees = {
employee1: {
name: "John",
age: "24"
},
employee2: {
name: "Jane",
age: "20"
}
}
更新されたオブジェクト（ジョンの年齢が変更されたことに注意してください）：
const employees = {
employee1: {
name: "John",
age: "25"
},
employee2: {
name: "Jane",
age: "20"
}
}
子コンポーネントの内部で、従業員を小道具として取得します。
componentWillReceiveProps(nextProps) {
const {employees} = this.props;
if (nextProps.employees !== employees) {
// Run function...
}
}
componentDidUpdateコールバックフックを使用します。にアクセスできます(prevProps, prevState, ..)。
同等性テスト_.isEqualでは、2つの値を詳細に比較して、それらが同等であるかどうかを判断する方法を使用します。
componentDidUpdate(prevProps) {
const {
employees
} = this.props;
if (!_.isEqual(prevProps.employees, employees)) {
// Run function...
}
}
注：LookcomponentDidUpdateメソッドは、render()が実行された後に呼び出されます。したがって、小道具の検証に基づいてコンポーネントのレンダリングを却下する場合は、shouldcomponentupdate正しい選択になります。
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加