'React-Native Linking AddEventListener not working

Hi I was trying to use React-Native's Linking library to listen to Linking changes and I followed the instructions on https://facebook.github.io/react-native/docs/linking.html. I can open external URL using openURL but Linking.addEventListener doesn't seem to work for me. I copied the code snippet:

componentDidMount() {
  Linking.addEventListener('url', this._handleOpenURL);
},
componentWillUnmount() {
  Linking.removeEventListener('url', this._handleOpenURL);
},
_handleOpenURL(event) {
  console.log(event.url);
}

it doesn't give me an error but the _handleOpenURL is not called when the app opens up a external URL.

I wonder why is this case and what should I do to fix it?



Solution 1:[1]

This is because Linking have a specific method when the app start through a intent.

Try with this:

componentDidMount() {
  Linking.getInitialURL().then((ev) => {
    if (ev) {
      this._handleOpenURL(ev);
    }
  }).catch(err => {
      console.warn('An error occurred', err);
  });
  Linking.addEventListener('url', this._handleOpenURL);
}

Solution 2:[2]

I had the same problem that I managed to fix for 2 days. Here are my steps, I hope it will help to the next one that needs to manage to fix this problem.

  1. Go to the React Native Documentation for your version (IMPORTANT) - https://facebook.github.io/react-native/versions
  2. Go to Linking API documentation (Follow the steps)

In my case, I just added this method

// iOS 9.x or newer
#import <React/RCTLinkingManager.h>

- (BOOL)application:(UIApplication *)application
   openURL:(NSURL *)url
   options:(NSDictionary<UIApplicationOpenURLOptionsKey,id> *)options
{
  return [RCTLinkingManager application:application openURL:url options:options];
}

After that, the event listener will work properly. Check the IOS version there is a snippet for 8.x and bellow.

Solution 3:[3]

For anyone who has ejected from expo - you DON'T need to add this code to AppDelegate (unlike it stated in the documentation here: https://reactnative.dev/docs/0.60/linking). I don't know why this works and I'm not sure why the documentation doesn't state this.. perhaps it's assuming you haven't ejected.

    - (BOOL)application:(UIApplication *)application continueUserActivity:(nonnull NSUserActivity *)userActivity
 restorationHandler:(nonnull void (^)(NSArray<id<UIUserActivityRestoring>> * _Nullable))restorationHandler
{
 return [RCTLinkingManager application:application
                  continueUserActivity:userActivity
                    restorationHandler:restorationHandler];
}

Just leave it like so

    - (BOOL)application:(UIApplication *)application continueUserActivity:(NSUserActivity *)userActivity restorationHandler:(void (^)(NSArray<id<UIUserActivityRestoring>> * _Nullable))restorationHandler
{
  return [super application:application continueUserActivity:userActivity restorationHandler:restorationHandler];
}

As soon as I removed it Linking.addEventListener('url', this._handleOpenURL); started working for me.

Solution 4:[4]

Try use Linking.removeAllListeners('url'); to remove

I use in my project and it works:

  useEffect(() => {
    Linking.addEventListener('url', _handleOpenURL);
    return () => {
      Linking.removeAllListeners('url');
    };
  }, []);

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 David Schumann
Solution 2 Ivan Abadzhiev
Solution 3 user14090411
Solution 4 Nguyễn Xuân Cảm