Skip to content

Commit

Permalink
Merge branch 'master' of https://github.com/reactjs/reactjs.org into …
Browse files Browse the repository at this point in the history
…sync-e3cf542e
  • Loading branch information
tesseralis committed Feb 9, 2019
2 parents bdac0d1 + e3cf542 commit 5bf5093
Show file tree
Hide file tree
Showing 2 changed files with 3 additions and 5 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -213,7 +213,7 @@ To recap, when designing a component, it is important to decide whether its data
Instead of trying to **"mirror" a prop value in state**, make the component **controlled**, and consolidate the two diverging values in the state of some parent component. For example, rather than a child accepting a "committed" `props.value` and tracking a "draft" `state.value`, have the parent manage both `state.draftValue` and `state.committedValue` and control the child's value directly. This makes the data flow more explicit and predictable.

For **uncontrolled** components, if you're trying to reset state when a particular prop (usually an ID) changes, you have a few options:
* **Recomendation: To reset _all internal state_, use the `key` attribute.**
* **Recommendation: To reset _all internal state_, use the `key` attribute.**
* Alternative 1: To reset _only certain state fields_, watch for changes in a special property (e.g. `props.userID`).
* Alternative 2: You can also consider fall back to an imperative instance method using refs.

Expand Down
6 changes: 2 additions & 4 deletions content/docs/hooks-reference.md
Original file line number Diff line number Diff line change
Expand Up @@ -232,7 +232,7 @@ You can also create the initial state lazily. To do this, you can pass an `init`

It lets you extract the logic for calculating the initial state outside the reducer. This is also handy for resetting the state later in response to an action:

```js{1-3,11-12,21,26}
```js{1-3,11-12,19,24}
function init(initialCount) {
return {count: initialCount};
}
Expand All @@ -246,9 +246,7 @@ function reducer(state, action) {
case 'reset':
return init(action.payload);
default:
// A reducer must always return a valid state.
// Alternatively you can throw an error if an invalid action is dispatched.
return state;
throw new Error();
}
}
Expand Down

0 comments on commit 5bf5093

Please sign in to comment.