React Native Linking与 Android原生页

作者: 闲庭 | 来源:发表于2019-02-20 23:06 被阅读7次
    1. 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>
        
    2. 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原生页

        本文链接:https://www.haomeiwen.com/subject/tjgtsqtx.html