reactjs - 使用 Deeplinking 和 React-Navigation-5 获取前缀后的所有内容作为参数

标签 reactjs react-native react-navigation deep-linking react-navigation-v5

我正在使用 react-navigation-5 和深层链接。我想提取深层链接前缀后的所有内容并将其作为参数传递。

我有以下内容

const deeplinking = {
    prefixes: ['myapp://'],
    config: {
      Store: {
        path:'store/:url' ,
        params: {
          url: null,      
        },
      }
  }
  };

  return (
    <NavigationContainer linking={deeplinking}>
      <Stack.Navigator initialRouteName="Splash" screenOptions={{ headerShown: false,   cardStyle: { backgroundColor: '#fff' } }}>
        <Stack.Screen name="Splash" component={Splash} />
        <Stack.Screen name="Store" component={Store} />

      </Stack.Navigator>
    </NavigationContainer>
  );
}

如果我使用以下深层链接:

myapp://alpha/delta/gamma

url参数变为:

'alpha' 

因此,在传递深度链接时,在前缀之后遇到的第一个正斜杠 / 以及它之后的所有内容都将被删除。

我希望参数(上例中的 url)为:

'alpha/delta/gamma'

我怎样才能做到这一点?

我在这里查看了文档: https://reactnavigation.org/docs/deep-linking/ https://reactnavigation.org/docs/configuring-links/

但是他们没有提到如何处理正斜杠。

最佳答案

  config: {
    screens: {
      deeplink: {
        path: 'deeplink/id',
      },
    },
  },
}
Make deeplink url:
https://example.com/deeplink/details?token=uygiuhiuhpuihpiuyiuhuihhiluhiu

Access token from component:
this.props.route.params.token

result will be =uygiuhiuhpuihpiuyiuhuihhiluhiu

关于reactjs - 使用 Deeplinking 和 React-Navigation-5 获取前缀后的所有内容作为参数,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65063415/

相关文章:

reactjs - 如何在React Native中导入组件过去的两个文件夹?

android - E/SoLoader : couldn't find DSO to load: libjscexecutor. 所以

android - 从 react-native-maps 启动谷歌地图应用程序

react-native - 全局更改导航背景颜色

javascript - 我在这里修改我的 Redux 状态吗?

html - React - Material 用户界面 : How to remove scrollbar from table

android - react native 任务 :app:multiDexListDebug FAILED

react-native - react 导航隐藏一个标签

react-native - 如何在React Native中的react选项卡导航中设置默认屏幕Route

Javascript promise 在 React-Enzyme 测试中不返回模拟值