Question

我正在开展一个我希望与react-native-web进行大多跨平台的项目。

我在这里使用这个react-native入门模板：https://github.com/react-everywhere/re-start

我唯一努力工作的是URL路由。

在我的index.js中，我有我的App组件：

class App extends React.Component {
render() {
    return (
        <Provider store={store}>
            <Router>
                <Switch>
                    <Route path='/about' component={AboutScreenComponent}/>
                    <Route exact path='/' component={TopLevelComponent}/>
                </Switch>
            </Router>
        </Provider>
    );
}

然后我只想测试链接，因此我在<Link to="/about"><Text>Link to About</Text</Link>内添加了TopLevelComponent。

在网络上，它的工作方式与预期一致。在Android模拟器中，点击链接不会做任何事情。

关于此功能的文档很轻松。我知道我需要对DeepLinking做点什么，但我还不确定我需要做什么。我的理解是我需要修改android清单文件以允许URL路由，但我也没有太多运气。

如果我的开发服务器是localhost：3000，如何在android上启用react-router-native的URL路由？

Answer 1

我的感觉是共享的跨平台组件应该主要是您的纯视图组件。应用程序的外层，如路由，应使用最适合该平台的库，即用于Web的反应路由器，以及用于本机的反应导航或类似的。也许在未来我们可以拥有一个真正统一的代码库，但是现在它并不觉得技术已经准备就绪......

Answer 2

我的猜测是：

import React from 'react'
import { Platform } from 'react-native'

let Router
if (Platform.OS === 'web') {
  Router = require('react-router-dom').BrowserRouter
} else {
  Router = require('react-router-native').NativeRouter
}

如何使用React Router 4进行跨平台（Web和本机）URL路由？

2 个答案: