时间戳

首页 > 解决方案 > 开发环境中的博览会和反应导航深层链接-我做错了什么？

react-native - 开发环境中的博览会和反应导航深层链接-我做错了什么？

问题描述

一旦用户单击 webview/iframe 中的链接，我试图让 webview 重定向到不同的屏幕。

Screens.js

const AppStack = createBottomTabNavigator(
  {
    Ritual: {
      screen: RitualScreen,
    },
    Home: {
      screen: HomeScreen,
    },
    NewsFeed: {
      screen: WallScreen,
      path: 'newsfeed'
    }...


const AppContainer = createAppContainer(
  createSwitchNavigator(
    {
      AuthLoading: AuthLoadingScreen,
      App: {screen: AppStack, path: 'home'},
      Auth: AuthStack
    },
    {
      initialRouteName: 'AuthLoading',
    }
  )
);

export default AppContainer;

然后在RitualScreen哪个页面上加载应用程序时加载的页面.. 在 web 视图中加载调查。当用户单击FINISH链接时，我希望将用户重定向到新闻源，例如：我认为这是：

exp://localhost:19000/home/newsfeed- 但除了一个空的路径（exp：// localhost：19000）之外的任何路径都会中断..我错过了什么？

我知道在生产中我需要将域更改为我的方案，例如 myapp:// 或使用自动更改 uri 中前缀的链接方法。

但现在我只想让它在开发环境中工作。

在此处输入图像描述

在此处输入图像描述

标签： react-nativereact-navigationexpodeep-linking

解决方案

我想我已经找到了解决办法——虽然它很厚颜无耻，哈哈

呈现 Webview 的屏幕...

 20   render() {
 21     return (
 22       
 32       <WebView
 33         onNavigationStateChange={ 
             (e) => { 
               if(e.url == "https://www.google.com/") this.props.navigation.navigate("NewsFeed")
             }
          }
 34       source={{ uri: 'https://s.surveyanyplace.com/a-path-to-load' }} style={styles.WebView} />
 37     )
 38   };
 39 }

因此，本质上是在它即将发生之前捕获到特定路径的重定向，并使用 react navigator 转到应用程序内的屏幕。

推荐阅读