有没有办法在React Native中的模式上放置一个提示符?(iOS版本)

dluptydi  于 2023-10-22  发布在  React
关注(0)|答案(1)|浏览(113)

我有以下情况:我在应用程序中有一个模态,通过放置在其中的按钮,我想在它上面启动一个确认提示。
这个确认提示(称为<ConfirmationPrompt>)是全局的,位于我的应用程序的根目录下,在App.tsx组件中。它的状态(无论是否可见)都是通过Redux全局状态控制的。

我在Android中是如何做的(它可以工作):我用了两个模态。从第一个模态开始,我设置了<ConfirmationPrompt>组件的全局状态,第二个模态显示在第一个模态之上。
**iOS中的问题:**据我所知,React Native(iOS)不允许两个modal同时启动,彼此重叠。

我尝试的是:
1.使用react-native-modal等库。他们也不支持iOS上的多种模式,只支持Android。
1.我的<ConfirmationPrompt>组件没有使用modal,而是使用了一个自定义的View组件,它的行为类似于modal。然而,我没能做到这一点。
1.使用纯javascript对话库(例如:react-native-dialog)。这不起作用,但据我所知,它仍然在React-Native的模态组件之上使用了一个瘦抽象。

实现这一目标的最佳途径是什么?

nvbavucw

nvbavucw1#

一个解决方法是使用ReactNavigation,将演示设置为'modal','martrentModal'或'fullScreenModal',那么这个屏幕将占据整个屏幕(或者如果设置为'modal',则占据大部分屏幕),您仍然可以在这个屏幕上打开一个模态。

<NavigationStack.Screen
    name={YourRouteName}
    component={YourComponent}
    options={{
      presentation: 'fullScreenModal'
    }}
  />

下面是一个示例:
https://snack.expo.dev/@sasserlnd/opening-a-modal-%7C-react-navigation

相关问题