React Native链接AddEventListener不工作

bq9c1y66  于 2022-12-24  发布在  React
关注(0)|答案(5)|浏览(277)

嗨,我尝试使用React-Native的链接库来监听链接更改,我按照https://facebook.github.io/react-native/docs/linking.html上的说明操作。我可以使用openURL打开外部URL,但Linking.addEventListener似乎不起作用。我复制了代码片段:

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

它没有给予我一个错误,但_handleOpenURL没有调用时,应用程序打开了一个外部URL。
我想知道为什么会有这种情况,我应该做些什么来解决它?

wwwo4jvm

wwwo4jvm1#

这是因为当应用通过Intent启动时,链接具有特定的方法。
试试这个:

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

jgwigjjp2#

我有同样的问题,我设法解决了2天。这里是我的步骤,我希望它将有助于下一个需要设法解决这个问题。
1.转到您的版本的React本机文档(重要)-https://facebook.github.io/react-native/versions
1.转到链接API文档(按照步骤操作)
在我的例子中,我只是添加了这个方法

// 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];
}

之后,事件侦听器将正常工作。检查IOS版本有8. x和以下的片段。

juud5qan

juud5qan3#

对于从expo中弹出的任何人-您不需要将此代码添加到AppDelegate(不像此处文档中所述:https://reactnative.dev/docs/0.60/linking).我不知道为什么这个工作,我不知道为什么文档没有说明这一点..也许它是假设你还没有弹出.

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

就这样放着吧

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

我一把它取下来,Linking.addEventListener('url', this._handleOpenURL);就开始为我工作了。

kmpatx3s

kmpatx3s4#

我使用的是裸工作流,这就是我如何实现将事件侦听器链接到功能组件的方法。
1.为一个裸的React原生项目设置深度链接。你也可以在文档中找到Expo项目的说明。
1.将链接事件侦听器添加到useEffect挂钩。

useEffect(() => {
   const linkingEvent = Linking.addEventListener('url', handleDeepLink);
   Linking.getInitialURL().then(url => {
      if (url) {
         handleDeepLink({url});
      }
   });
   return () => {
      linkingEvent.remove();
   };
}, [handleDeepLink]);

const handleDeepLink = async (url) => {
   // add your code here
}
ao218c7q

ao218c7q5#

尝试使用Linking.removeAllListeners('url');删除
我在我的项目中使用,它工作:

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

相关问题