From 7e866537a156ec3a978cf47d693936719619aabf Mon Sep 17 00:00:00 2001 From: Melissa Date: Mon, 15 Oct 2018 02:37:42 -0500 Subject: [PATCH] Remove duplicate sections from 'react/state' (#18585) * Remove duplicate sections from 'react/state' The "updating state" section was duplicated, so I removed one of them. I also corrected the heading levels for the subheadings below "updating state". It went from h2 to h5 and now goes properly from h2 to h3. * Update index.md --- .../pages/guide/english/react/state/index.md | 29 +++---------------- 1 file changed, 4 insertions(+), 25 deletions(-) diff --git a/client/src/pages/guide/english/react/state/index.md b/client/src/pages/guide/english/react/state/index.md index f99ce4b71db..f50d3ce8db9 100644 --- a/client/src/pages/guide/english/react/state/index.md +++ b/client/src/pages/guide/english/react/state/index.md @@ -72,53 +72,32 @@ export default App; ## Updating State You can change the data stored in the state of your application using the `setState` method on your component. -```js -this.setState({ value: 1 }); -``` - -Keep in mind that `setState` is asynchronous so you should be careful when using the current state to set a new state. A good example of this would be if you want to increment a value in your state. - -#### The Wrong Way -```js -this.setState({ value: this.state.value + 1 }); -``` - -This can lead to unexpected behavior in your app if the code above is called multiple times in the same update cycle. To avoid this you can pass an updater callback function to `setState` instead of an object. - -#### The Right Way -```js -this.setState(prevState => ({ value: prevState.value + 1 })); -``` - -## Updating State -You can change the data stored in the state of your application using the `setState` method on your component. - ```js this.setState({value: 1}); ``` Keep in mind that `setState` may be asynchronous so you should be careful when using the current state to set a new state. A good example of this would be if you want to increment a value in your state. -##### The Wrong Way +#### The Wrong Way ```js this.setState({value: this.state.value + 1}); ``` This can lead to unexpected behavior in your app if the code above is called multiple times in the same update cycle. To avoid this you can pass an updater callback function to `setState` instead of an object. -##### The Right Way +#### The Right Way ```js this.setState(prevState => ({value: prevState.value + 1})); ``` -##### The Cleaner Way +#### The Cleaner Way ``` this.setState(({ value }) => ({ value: value + 1 })); ``` When only a limited number of fields in the state object is required, object destructing can be used for cleaner code. -### More Information +#### More Information - [React - State and Lifecycle](https://reactjs.org/docs/state-and-lifecycle.html) - [React - Lifting State Up](https://reactjs.org/docs/lifting-state-up.html)