react native unsubscribe event listener

Question

I have a react native component with two event listeners for linking and for dynamicLinks, how do I unsubscribe for both using hooks?

  useEffect(() => {
    // Update the document title using the browser API
    if (Platform.OS === "ios") {
      SecurityScreen.enabled(true);
    }
    // global.perra = "a";

    usingAlternativeAPI();

    Linking.addEventListener("url", deepLinkHandler);

    const unsubscribe = dynamicLinks().onLink(handleDynamicLink);
    // When the component is unmounted, remove the listener
    return () => unsubscribe();

  }, []);

Answer 1

Linking lib has a removeEventListener() function you can call with passing the url event type and the handler. This code should work.

     useEffect(() => {
        // useEffect code here
        return function cleanup() {
          unsubscribe();
          Linking.removeEventListener("url", deepLinkHandler);
        };
      }, []);

Answer 2

Have you tried this before?

useEffect(() => {
    // Update the document title using the browser API
    if (Platform.OS === "ios") {
      SecurityScreen.enabled(true);
    }
    // global.perra = "a";

    usingAlternativeAPI();

    const un = Linking.addEventListener("url", deepLinkHandler);

    const unsubscribe = dynamicLinks().onLink(handleDynamicLink);
    // When the component is unmounted, remove the listener
    return () => { 
         unsubscribe();
         un()
         }

  }, []);

Answer 3

At the moment the documentation points to do this way,

 useEffect(() => {
   const unsub = Linking.addEventListener("url", ({ url: _url }) => {
                 setUrl(_url);
   });
   return unsub.remove();
 }, []);