问使用RN、React导航和React Native Web的通用应用程序的最佳实践

EN

以下是部分答案，重要的考虑因素，以及进一步研究的可能起点。

屏幕大小

除非你有资源为小屏幕和大屏幕创建完全不同的视图，否则让你的应用程序在台式机/笔记本电脑屏幕上看起来合理的一种方法是添加水平边距。这可以通过使用如下视图包装您的应用程序导航器来实现：

<View
  onLayout={this._handleLayout}
  style={[styles.appContainer, this.state.isWide && styles.wide]}>

和

  _handleLayout = ({ nativeEvent }) => {
    const { width } = nativeEvent.layout;
    this.setState(() => ({ isWide: width > 600 }));
  };

选项卡栏、页眉和其他导航元素

React Navigation内置了对标题和选项卡栏的支持，然而，桌面/笔记本电脑屏幕上的标准移动布局看起来很丑陋。由于您可能正在使用为移动设备设计的导航器组件，如createBottomTabNavigator和createDrawerNavigator，一种选择是为桌面布局创建自定义导航器。这可能需要一些工作，因为没有用于桌面布局的标准导航器组件。

另一个问题是，你可能希望你的标题栏不同，因为有更多的空间来添加导航元素，搜索栏等。React navigation没有提供如何做到这一点的示例，所以它可能很困难。

Web URL、路由器、服务器渲染等。

React Navigation 3.x docs say认为web支持应该被认为是实验性的，并在这些问题上提供了稀疏的指导。react-navigation/web模块提供了“用于在web浏览器和服务器上进行反应导航的工具”，但几乎没有文档。使用SwitchRouter can be found here设置简单web应用程序的示例。然而，我找不到任何关于将URL参数与路由一起使用的信息。