You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
In order to have the clock's time update every second, we need to know when `<Clock>` gets mounted to the DOM. _If you've used HTML5 Custom Elements, this is similar to the `attachedCallback` and `detachedCallback` lifecycle methods._ Preact invokes the following lifecycle methods if they are defined for a Component:
|`componentWillMount()`| (deprecated) before the component gets mounted to the DOM |
87
-
|`componentDidMount()`| after the component gets mounted to the DOM |
88
-
|`componentWillUnmount()`| prior to removal from the DOM |
89
-
|`componentWillReceiveProps(nextProps, nextContext)`| before new props get accepted _(deprecated)_|
90
-
|`getDerivedStateFromProps(nextProps, prevState)`| just before `shouldComponentUpdate`. Return object to update state or `null` to skip update. Use with care. |
91
-
|`shouldComponentUpdate(nextProps, nextState, nextContext)`| before `render()`. Return `false` to skip render |
92
-
|`componentWillUpdate(nextProps, nextState, nextContext)`| before `render()`_(deprecated)_|
93
-
|`getSnapshotBeforeUpdate(prevProps, prevState)`| called just before`render()`. return value is passed to `componentDidUpdate`.|
94
-
|`componentDidUpdate(prevProps, prevState, snapshot)`| after `render()`|
|`componentWillMount()`| (deprecated) before the component gets mounted to the DOM |
87
+
|`componentDidMount()`| after the component gets mounted to the DOM |
88
+
|`componentWillUnmount()`| prior to removal from the DOM |
89
+
|`componentWillReceiveProps(nextProps, nextContext)`| before new props get accepted _(deprecated)_|
90
+
|`getDerivedStateFromProps(nextProps, prevState)`| just before `shouldComponentUpdate`. Return object to update state or `null` to skip update. Use with care. |
91
+
|`shouldComponentUpdate(nextProps, nextState, nextContext)`| before `render()`. Return `false` to skip render |
92
+
|`componentWillUpdate(nextProps, nextState, nextContext)`| before `render()`_(deprecated)_|
93
+
|`getSnapshotBeforeUpdate(prevProps, prevState)`| called just after`render()`, but before changes are flushed to the DOM. Return value is passed to `componentDidUpdate`. |
94
+
|`componentDidUpdate(prevProps, prevState, snapshot)`| after `render()`|
95
95
96
96
Here's a visual overview of how they relate to each other (originally posted in [a tweet](https://web.archive.org/web/20191118010106/https://twitter.com/dan_abramov/status/981712092611989509) by Dan Abramov):
In order to have the clock's time update every second, we need to know when `<Clock>` gets mounted to the DOM. _If you've used HTML5 Custom Elements, this is similar to the `attachedCallback` and `detachedCallback` lifecycle methods._ Preact invokes the following lifecycle methods if they are defined for a Component:
|`componentWillMount()`| (deprecated) before the component gets mounted to the DOM |
87
-
|`componentDidMount()`| after the component gets mounted to the DOM |
88
-
|`componentWillUnmount()`| prior to removal from the DOM |
89
-
|`componentWillReceiveProps(nextProps, nextContext)`| before new props get accepted _(deprecated)_|
90
-
|`getDerivedStateFromProps(nextProps, prevState)`| just before `shouldComponentUpdate`. Return object to update state or `null` to skip update. Use with care. |
91
-
|`shouldComponentUpdate(nextProps, nextState, nextContext)`| before `render()`. Return `false` to skip render |
92
-
|`componentWillUpdate(nextProps, nextState, nextContext)`| before `render()`_(deprecated)_|
93
-
|`getSnapshotBeforeUpdate(prevProps, prevState)`| called just before`render()`. return value is passed to `componentDidUpdate`.|
94
-
|`componentDidUpdate(prevProps, prevState, snapshot)`| after `render()`|
|`componentWillMount()`| (deprecated) before the component gets mounted to the DOM |
87
+
|`componentDidMount()`| after the component gets mounted to the DOM |
88
+
|`componentWillUnmount()`| prior to removal from the DOM |
89
+
|`componentWillReceiveProps(nextProps, nextContext)`| before new props get accepted _(deprecated)_|
90
+
|`getDerivedStateFromProps(nextProps, prevState)`| just before `shouldComponentUpdate`. Return object to update state or `null` to skip update. Use with care. |
91
+
|`shouldComponentUpdate(nextProps, nextState, nextContext)`| before `render()`. Return `false` to skip render |
92
+
|`componentWillUpdate(nextProps, nextState, nextContext)`| before `render()`_(deprecated)_|
93
+
|`getSnapshotBeforeUpdate(prevProps, prevState)`| called just after`render()`, but before changes are flushed to the DOM. Return value is passed to `componentDidUpdate`. |
94
+
|`componentDidUpdate(prevProps, prevState, snapshot)`| after `render()`|
95
95
96
96
Here's a visual overview of how they relate to each other (originally posted in [a tweet](https://web.archive.org/web/20191118010106/https://twitter.com/dan_abramov/status/981712092611989509) by Dan Abramov):
0 commit comments