Q群 567530369,小伙伴们都在这里等你哦~

Linking

Linking提供了一个通用的接口来与传入和传出的 App 链接进行交互。

基本用法

处理链接

如果你的应用被其注册过的外部 url 调起,则可以在任何组件内这样获取和处理它:

componentDidMount() {
  Linking.getInitialURL().then((url) => {
    if (url) {
      console.log('Initial url is: ' + url);
    }
  }).catch(err => console.error('An error occurred', err));
}

要了解更多如何在 Android 上支持深度链接的说明,请参阅Enabling Deep Links for App Content - Add Intent Filters for Your Deep Links.

如果要在现有的 MainActivity 中监听传入的 intent,那么需要在AndroidManifest.xml中将 MainActivity 的launchMode设置为singleTask。相关解释可参考<activity>文档。

<activity
  android:name=".MainActivity"
  android:launchMode="singleTask">

注: 对于 iOS 来说,如果要在 App 启动后也监听传入的 App 链接,那么首先需要在项目中链接RCTLinking,具体步骤请参考手动链接这篇文档,然后需要在AppDelegate.m中增加以下代码:


// iOS 9.x 或更高版本
#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 或更低版本
#import <React/RCTLinkingManager.h>

- (BOOL)application:(UIApplication *)application openURL:(NSURL *)url
  sourceApplication:(NSString *)sourceApplication annotation:(id)annotation
{
  return [RCTLinkingManager application:application openURL:url
                      sourceApplication:sourceApplication annotation:annotation];
}

如果你的 app 用了 Universal Links,需要正确的把下述代码添加进去:


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

然后你的 React 组件就可以监听Linking的相关事件:


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

打开外部链接

要启动一个链接相对应的应用(打开浏览器、邮箱或者其它的应用),只需调用:

Linking.openURL(url).catch(err => console.error('An error occurred', err));

如果想在打开链接前先检查是否安装了对应的应用,则调用以下方法:

Linking.canOpenURL(url).then(supported => {
  if (!supported) {
    console.log('Can\'t handle url: ' + url);
  } else {
    return Linking.openURL(url);
  }
}).catch(err => console.error('An error occurred', err));

查看方法


文档

方法

constructor()


constructor();

addEventListener()

addEventListener(type, handler);

添加一个监听 Linking 变化的事件。type 参数应填url,并提供一个处理函数。


removeEventListener()

removeEventListener(type, handler);

删除一个事件处理函数。type 参数应填url


openURL()

openURL(url);

尝试使用设备上已经安装的应用打开指定的url

你还可以使用其他类型的 URL,比如一个地理位置(形如"geo:37.484847,-122.148386"或是一个通讯录名片,只要是可以通过已安装的应用打开的即可。

本方法会返回一个Promise对象。如果用户在弹出的对话框中点击了确认或是 url 自动打开了,则 promise 成功完成。如果用户在弹出的对话框中点击取消或是没有对应应用可以处理此类型的 url,则 promise 会失败。

参数:

名称类型必填说明
urlstring要打开的 URL

如果系统不知道如何处理给定的 URL,则此方法会调用失败。如果你传入的 URL 不是一个 http 链接,则最好先通过{@code canOpenURL}方法检查一下。

对于 web 链接来说,协议头("http://", "https://")不能省略!


canOpenURL()

canOpenURL(url);

判断设备上是否有已经安装的应用可以处理指定的 URL。

本方法会返回一个Promise对象。当确定传入的 URL 可以被处理时,promise 就会返回,值的第一个参数是表示是否可以打开 URL。

参数:

名称类型必填说明
urlstring要打开的 URL

对于 web 链接来说,协议头("http://", "https://")不能省略!

对于 iOS 9 来说,你需要在Info.plist中添加LSApplicationQueriesSchemes字段,否则canOpenURL可能一直返回 false。


getInitialURL()

getInitialURL();

如果应用是被一个链接调起的,则会返回相应的链接地址。否则它会返回null

如果要在 Android 上支持深度链接,请参阅http://developer.android.com/training/app-indexing/deep-linking.html#handling-intents