Skip to content

Commit 707f830

Browse files
authored
docs(react): document lifecycle hook dependencies arg
resolves #1949
1 parent 7e081fa commit 707f830

File tree

1 file changed

+10
-0
lines changed

1 file changed

+10
-0
lines changed

docs/react/lifecycle.md

+10
Original file line numberDiff line numberDiff line change
@@ -133,6 +133,16 @@ export default HomePage;
133133
Functional components don't need to be wrapped with the `withIonLifeCycle` HOC as class components do.
134134
:::
135135

136+
Developers can also optionally pass reactive dependencies to each lifecycle hook. These are then passed to the underlying [React useEffect hook](https://react.dev/reference/react/useEffect#useeffect):
137+
138+
```tsx
139+
const [data, setData] = useState('foo');
140+
141+
useIonViewDidEnter(() => {
142+
console.log('ionViewDidEnter event fired');
143+
}, [data]);
144+
```
145+
136146
## React LifeCycle Methods
137147

138148
All the lifecycle methods in React (`componentDidMount`, `componentWillUnmount`, etc..) are available for you to use as well. However, since Ionic React manages the lifetime of a page, certain events might not fire when you expect them to. For instance, `componentDidMount` fires the first time a page is displayed, but if you navigate away from the page Ionic might keep the page around in the DOM, and a subsequent visit to the page might not call `componentDidMount` again. This scenario is the main reason the Ionic lifecycle methods exist, to still give you a way to call logic when views enter and exit when the native framework's events might not fire.

0 commit comments

Comments
 (0)