diff --git a/versioned_docs/version-v5/main/guides/deep-links.md b/versioned_docs/version-v5/main/guides/deep-links.md index e1b2a4b74..b6eeae67f 100644 --- a/versioned_docs/version-v5/main/guides/deep-links.md +++ b/versioned_docs/version-v5/main/guides/deep-links.md @@ -90,23 +90,34 @@ import { App, URLOpenListenerEvent } from '@capacitor/app'; Next, define the AppUrlListener component, listening for the `appUrlOpen` event then redirecting when a deep link is found: ```typescript -const AppUrlListener: React.FC = () => { - let history = useHistory(); +function AppUrlListener(): null { + const history = useHistory(); + useEffect(() => { - App.addListener('appUrlOpen', (event: URLOpenListenerEvent) => { + const onAppUrlOpen = (event: URLOpenListenerEvent): void => { // Example url: https://beerswift.app/tabs/tab2 // slug = /tabs/tab2 - const slug = event.url.split('.app').pop(); + const slug = event.url.split('.com').pop(); if (slug) { - history.push(slug); + navigate(slug); } // If no match, do nothing - let regular routing // logic take over + }; + + App.addListener('appUrlOpen', onAppUrlOpen).catch((err) => { + console.log(err); }); - }, []); + + return () => { + App.removeAllListeners().catch((err) => { + console.log(err); + }); + }; + }, [history]); return null; -}; +} export default AppUrlListener; ```