From 3e80980c18018822fa94f2ba2bc236aec8a9994f Mon Sep 17 00:00:00 2001 From: Brian Vaughn Date: Thu, 24 May 2018 18:18:04 -0700 Subject: [PATCH] Renamed params for gDSFP --- content/docs/reference-react-component.md | 2 +- .../definition-getderivedstatefromprops.js | 2 +- .../updating-external-data-when-props-change-after.js | 6 +++--- .../updating-state-from-props-after.js | 11 +++++------ .../using-react-lifecycles-compat.js | 2 +- 5 files changed, 11 insertions(+), 12 deletions(-) diff --git a/content/docs/reference-react-component.md b/content/docs/reference-react-component.md index 0a5bdc995..eaf120022 100644 --- a/content/docs/reference-react-component.md +++ b/content/docs/reference-react-component.md @@ -186,7 +186,7 @@ If you "fork" props by using them for state, you might also want to implement [` ### `static getDerivedStateFromProps()` ```js -static getDerivedStateFromProps(nextProps, prevState) +static getDerivedStateFromProps(props, state) ``` `getDerivedStateFromProps` is invoked right before calling the render method, both on the initial mount and on subsequent updates. It should return an object to update the state, or null to update nothing. diff --git a/examples/update-on-async-rendering/definition-getderivedstatefromprops.js b/examples/update-on-async-rendering/definition-getderivedstatefromprops.js index d19e4d154..42b9295ea 100644 --- a/examples/update-on-async-rendering/definition-getderivedstatefromprops.js +++ b/examples/update-on-async-rendering/definition-getderivedstatefromprops.js @@ -1,5 +1,5 @@ class Example extends React.Component { - static getDerivedStateFromProps(nextProps, prevState) { + static getDerivedStateFromProps(props, state) { // ... } } diff --git a/examples/update-on-async-rendering/updating-external-data-when-props-change-after.js b/examples/update-on-async-rendering/updating-external-data-when-props-change-after.js index 78d595993..abde090bd 100644 --- a/examples/update-on-async-rendering/updating-external-data-when-props-change-after.js +++ b/examples/update-on-async-rendering/updating-external-data-when-props-change-after.js @@ -5,13 +5,13 @@ class ExampleComponent extends React.Component { }; // highlight-range{1-13} - static getDerivedStateFromProps(nextProps, prevState) { + static getDerivedStateFromProps(props, state) { // Store prevId in state so we can compare when props change. // Clear out previously-loaded data (so we don't render stale stuff). - if (nextProps.id !== prevState.prevId) { + if (props.id !== state.prevId) { return { externalData: null, - prevId: nextProps.id, + prevId: props.id, }; } diff --git a/examples/update-on-async-rendering/updating-state-from-props-after.js b/examples/update-on-async-rendering/updating-state-from-props-after.js index 19b920a99..7135a6e3c 100644 --- a/examples/update-on-async-rendering/updating-state-from-props-after.js +++ b/examples/update-on-async-rendering/updating-state-from-props-after.js @@ -8,13 +8,12 @@ class ExampleComponent extends React.Component { lastRow: null, }; - // highlight-range{1-8} - static getDerivedStateFromProps(nextProps, prevState) { - if (nextProps.currentRow !== prevState.lastRow) { + // highlight-range{1-7} + static getDerivedStateFromProps(props, state) { + if (props.currentRow !== state.lastRow) { return { - isScrollingDown: - nextProps.currentRow > prevState.lastRow, - lastRow: nextProps.currentRow, + isScrollingDown: props.currentRow > state.lastRow, + lastRow: props.currentRow, }; } diff --git a/examples/update-on-async-rendering/using-react-lifecycles-compat.js b/examples/update-on-async-rendering/using-react-lifecycles-compat.js index fdc0364cb..46ff489f0 100644 --- a/examples/update-on-async-rendering/using-react-lifecycles-compat.js +++ b/examples/update-on-async-rendering/using-react-lifecycles-compat.js @@ -4,7 +4,7 @@ import {polyfill} from 'react-lifecycles-compat'; class ExampleComponent extends React.Component { // highlight-next-line - static getDerivedStateFromProps(nextProps, prevState) { + static getDerivedStateFromProps(props, state) { // Your state update logic here ... } }