Flesh out the basics of the most common methods
This commit is contained in:
parent
df351f55cc
commit
910007114c
55
README.md
55
README.md
@ -45,17 +45,72 @@ static getDerivedStateFromProps (nextProps, prevState) {
|
|||||||
|
|
||||||
#### componentDidMount ()
|
#### componentDidMount ()
|
||||||
|
|
||||||
|
```js
|
||||||
|
/**
|
||||||
|
* Component mounted, will render soon
|
||||||
|
*/
|
||||||
|
componentDidMount () {
|
||||||
|
// Network calls, state changes,
|
||||||
|
// anything is fair game here
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
## Updating
|
## Updating
|
||||||
|
|
||||||
#### shouldComponentUpdate ()
|
#### shouldComponentUpdate ()
|
||||||
|
|
||||||
|
```js
|
||||||
|
/**
|
||||||
|
* Hook to control re-render
|
||||||
|
*
|
||||||
|
* @param {object} nextProps
|
||||||
|
* @param {object} nextState
|
||||||
|
* @return {boolean} - Whether to render this cycle
|
||||||
|
*/
|
||||||
|
shouldComponentUpdate (nextProps, nextState) {
|
||||||
|
// Default in React.Component
|
||||||
|
return true;
|
||||||
|
|
||||||
|
// React.PureComponent implements this method
|
||||||
|
// with a shallow compare of props and state
|
||||||
|
}
|
||||||
|
```
|
||||||
#### render ()
|
#### render ()
|
||||||
|
|
||||||
|
```js
|
||||||
|
/**
|
||||||
|
* Render returned components
|
||||||
|
*
|
||||||
|
* @return {React Element | string | number | Portal | null | boolean}
|
||||||
|
*/
|
||||||
|
render () {
|
||||||
|
return <div />;
|
||||||
|
}
|
||||||
|
```
|
||||||
#### getSnapshotBeforeUpdate ()
|
#### getSnapshotBeforeUpdate ()
|
||||||
|
|
||||||
|
```js
|
||||||
|
getSnapshotBeforeUpdate (prevProps, prevState) {
|
||||||
|
}
|
||||||
|
```
|
||||||
#### componentDidUpdate ()
|
#### componentDidUpdate ()
|
||||||
|
|
||||||
|
```js
|
||||||
|
componentDidUpdate (prevProps, prevState, snapshot = undefined) {
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
## Unmounting
|
## Unmounting
|
||||||
|
|
||||||
#### componentWillUnmount ()
|
#### componentWillUnmount ()
|
||||||
|
|
||||||
|
```js
|
||||||
|
componentWillUnMount () {
|
||||||
|
// Cleanup whatever you need to before the
|
||||||
|
// component unmounts
|
||||||
|
}
|
||||||
|
```
|
||||||
|
|
||||||
---
|
---
|
||||||
## Deprecated
|
## Deprecated
|
||||||
|
|
||||||
|
Loading…
Reference in New Issue
Block a user