与react导航的深度链接不起作用

IT技术 javascript reactjs react-native react-navigation deep-linking
2021-05-12 13:53:30

实际上，我正在使用 react-navigation 3.1.5 在 react-native 0.58 上开发应用程序，但我无法使我的应用程序正常运行。

这是我的代码：

app-navigation.js

const MainStack = createBottomTabNavigator({
  Home: { screen: Home },
  Pets: { screen: Pets, path: 'spidersecurity://terque/pets' },
  Notifications: { screen: UserNotifications },
  UpdateUser: { screen: UpdateUser },
});

const AppStack = createStackNavigator({
  MainStack: { screen: MainStack, path: '' },
  PetStack: { screen: PetStack }
});

const Main = createSwithNavigator({
  App: { screen: AppStack, path: '' }
});

基本上这是我的导航结构。我已将我的设置AndroidManifest.xml为以下内容：

<intent-filter android:label="filter_react_native">
    <action android:name="android.intent.action.VIEW" />
    <category android:name="android.intent.category.DEFAULT" />
    <category android:name="android.intent.category.BROWSABLE" />
    <data android:scheme="spidersecurity" android:host="terque" />
</intent-filter>

而且，当我打开带有地址的链接时，spidersecurity://terque/pets此链接会打开应用程序，但它不会导航到指定的屏幕。我不知道我是不是在做坏事，但我已经阅读了很多页面和博客，但都没有成功。

注意：我已验证“spidersecurity://terque/pets”是否是路由匹配，因为我console.log在获取链接时向我的代码添加了

2个回答

我刚刚创建了一个示例并确认它仍然有效；

也许你已经测试过了Chrome on android，但 Chrome 没有打开应用程序；在这种情况下，您可以在此处阅读更多相关信息：https : //developer.chrome.com/multidevice/android/intents

Chrome 已将其行为更改为 deeplink

你可以查看我的简单演示；在这种情况下，我只是做了一个非常简单的path https://github.com/tranquan/rn-deeplink-demo

您应该在导出的 createAppContainer 组件中将 URL 的基本部分指定为标记为 uriPrefix 的属性，并且terque/pets在“路径”中只有 URL 的第二部分。

这是他们文档中的一个示例：

如果您的项目是使用 Expo 创建的

const SimpleApp = createAppContainer(createStackNavigator({...}));

const prefix = Expo.Linking.makeUrl('/');

const MainApp = () => <SimpleApp uriPrefix={prefix} />;

如果您的项目是使用 react-native init 创建的

const SimpleApp = createAppContainer(createStackNavigator({...}));

const prefix = 'mychat://';

const MainApp = () => <SimpleApp uriPrefix={prefix} />;

尝试一下，看看它是否有效，因为他们的文档表明应该这样做。

我已经在示例项目中以这种方式对其进行了编码，当我使用他们建议的命令行说明进行测试时，它可以正常工作。

在我正在构建的实际应用程序中正确打开深层链接时，我仍然遇到问题，我已经完全按照他们的建议对其进行了编码，因此问题可能是由其他地方引起的。

我会先尝试更改您的代码以匹配他们的文档，如果这不起作用，请对此帖子发表评论，当我弄清楚时，我会告诉您我为我的应用程序找到的解决方案。

其它你可能感兴趣的问题
上一篇SVG圆形变形 下一篇react未定义