12

我的 react-native 应用程序有几种情况可以呈现不同的模式。我想知道实现这一目标的最佳方法是什么。一般来说,我看到两种不同的方法:

a) 在根视图上,我总是Modal安装 -component 并简单地切换内容,就像这样......

<View>
    {...}
    <Modal visible={this.props.modal > 0}>
         {this.props.modal === 1 && <ModalContent1 />}
         {this.props.modal === 2 && <ModalContent2 />}
         {this.props.modal === 3 && <ModalContent3 />}
    </Modal>
</View>

b)每个模态都有自己的Modal-component 并安装在树中的某个位置,靠近触发它的位置。

您更喜欢哪种方式,为什么?

适用于这两种方法的一个问题是,是否Modal应该始终安装 -component 并且只使用visible-prop 触发。如果这是要走的路,我假设方法 b) 需要更多内存,因为创建了Modal-component 的多个实例。

4

1 回答 1

0

我个人使用React Navigation中的Stack Navigator在我的应用程序中实现模式。我的模态包括“创建帖子模态”、“无互联网连接模态”等。

这使我可以从我的应用程序中的任何位置访问这些模式,并且可以直接保留/阻止其他操作。要了解有关如何使用 React Navigation 的更多信息,您可以阅读以下两个链接:

  1. 要了解StackNavigator,它有一个专门用于透明背景模式的部分
  2. 要了解更多关于在 React Navigation 中实现模式的一般信息。
于 2020-09-23T06:59:05.803 回答