React Native Linking与 Android原生页

2019-02-20 本文已影响7人闲庭

Linking 唤起APP.

检查该app能否被唤起，也就是检查该app是否已安装成功；
Linking提供了canOpenURL(url: string): Promise<boolean>;这个方法，用来检测某个url是否可以打开;
```
 Linking.canOpenURL('appscheme://').then(canopen => {
      ...
    })
```

唤起并传递参数。
使用Linking打开app调用openURL方法即可：
Linking.openURL('appscheme://apphost/path?params=xxx')
完整调用方法如下：

Linking.canOpenURL('appscheme://').then(canopen => {
  if (canopen) {
     console.warn('可以打开: appscheme');
     Linking.openURL('appscheme://apphost/path?rn=true')
  } else {
     console.warn('未安装: appscheme');
  }
})

备注： Android人员应该知道上述打开的路由appscheme://apphost/path?rn=true 哪里来的，非Android应该不太清楚，其实这里的路由是我们在Android项目中的AndroidManifest.xml 文件中设置的，如下：

<activity android:name=".RNPreloadActivity"
     android:launchMode="singleTask">
     <intent-filter>
          <data
               android:host="apphost"
               android:scheme="appscheme"/>
           <action android:name="android.intent.action.VIEW"/>
           <category android:name="android.intent.category.DEFAULT"/>
           <category android:name="android.intent.category.BROWSABLE"/>
     </intent-filter>
 </activity>

APP中唤起RN页面的Activity，并将路由信息通过linking传递到对应的js中。

APP中跳转加载RN的页面。

Intent intent1 = new Intent(Intent.ACTION_VIEW, Uri.parse("appscheme://apphost/path?params=xxx"));
startActivity(intent1);

RN页面渲染的js文件中如何获取跳转路由。

     Linking.getInitialURL().then((url) => {
          if (url) {
            console.warn('捕捉的URL地址为: ' + url);
          }else{
            console.warn('捕获得的url为空');
          }
     }).catch(err => console.error('错误信息为:', err));

在js中监听APP的运行状态。

     AppState.addEventListener('change',(appState)=>{
          if(appState=='active'){
              Linking.getInitialURL().then(url=>{
                  console.warn('stateChange url: ' + url);    
              })
          }
        })

监听的字符串以及状态如下：

export type AppStateEvent = "change" | "memoryWarning";
export type AppStateStatus = "active" | "background" | "inactive";

React Native Linking与 Android原生页

猜你喜欢

热点阅读