React Native Linking与 Android原生页面路由跳转问题

• 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";

作者：闲庭CC
链接：https://www.jianshu.com/p/137ccdd943ae