问题标签 [react-native-modal]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
1 回答
851 浏览

javascript - 从模态对原始组件反应本机调用函数

如何在组件上显示的模式中从根组件调用函数?

我的 HomePage.js 调用组件如下:

然后我的模态渲染如下。我的目标是,当用户单击他们拥有帐户时,他们将能够导航到 signInModal。为此,我想先关闭 signUpModal。

0 投票
2 回答
4626 浏览

react-native - 如何使用反应原生 WebView 在模式中显示网页?

我想以模式显示网页,我正在使用这行代码,但它显示的是空白模式。

0 投票
1 回答
629 浏览

javascript - Flatlist 项目在模态框内不可点击

在我的反应原生应用程序中,我有一个模态

在这个 Modal 里面我有一个 FlatList

在 IOS 上,FlatList 中的每个项目都是可点击的,并且 onPress 将触发“Working!!” 警报。

但是 onPress 不适用于 Android。如果我将 Flatlist 放在 Modal 之外,onPress 将触发警报。

谁能告诉我在试图让它在 Android 上的 Modal 中工作时我可能做错了什么?

Ps:我也试过用 TouchableOpacity 代替 TouchableWithoutFeedback 但无济于事

谢谢

0 投票
1 回答
524 浏览

image - React Native:模态屏幕未通过点击关闭

在我的 RN 0.62.2 应用程序/Android 模拟器中,我正在寻找一种方法来关闭显示图像的模式,只需点击屏幕而不是放置关闭按钮。这是应用程序应该做的事情:

这是渲染代码:

上面的代码可以通过1-3但不是4. 问题是无法在 Android 模拟器上关闭模态屏幕(模拟点击鼠标左键)。试着放进去<TouchableOpacity><Modal>没有用。下<TouchableOpacity>一个<Modal>只是没有回应记者。应用程序如何通过Modal点击关闭?

0 投票
3 回答
3534 浏览

react-native - React Native 应用程序在关闭模式或操作表后神秘地冻结

我遇到了一个问题,每次我在我们的 React Native 应用程序中关闭模式、操作表或警报时,应用程序都会完全冻结并且无法与之交互。

导航到新堆栈或单击按钮不会重现。

我必须终止应用程序并重新启动才能再次交互。通过打包程序重新加载应用程序没有帮助。

我们的代码可以在一个模式被关闭时自动显示一个新的模式并且确实有效 - 模式是可交互的。所以似乎只有底层内容被冻结,好像顶部仍然有一个模态但它是不可见的。

疯狂的是,这是在以前已知的好分支中复制的。所以本地配置/缓存肯定发生了一些变化,但我不知道是什么。我重新克隆了 repo,清除了 watchman/packager/yarn 缓存,擦除了所有数据的模拟器。没有什么可以解决问题。

打包程序、xcode 或 Flipper 中也没有日志表明可能出了什么问题。

使用react-native-modal@expo/react-native-action-sheet和内置的 React Native Alert(虽然不使用一般的 Expo 框架)。我已将这些库升级到最新版本。

没有想法了。我还能在哪里看?


更新:超级最少的代码复制。此模式自动显示、自动关闭,然后按钮无法按下。从代码中删除模式使按钮可以按下。

如果我添加一个最小的警报调用而不是模式,也会发生同样的情况。在这种情况下,我会在 5 秒后显示另一个可交互的警报。 只有弹出框是可交互的——例如警报和模式。

更新#2

看起来每个新的“popover”样式 UI 都会使以前的 UI 无法交互。

如果我按上述方式取消第一个Alert,则我无法与底层交互TouchableOpacity,但我可以与第二个 (5-second) 交互Alert

但是,如果我不关闭第一个警报并且第二个警报弹出,我只能关闭第二个警报而不与保持冻结的第一个警报交互。

0 投票
1 回答
1625 浏览

react-native - 在 Modal 中防止键盘关闭 React Native

我在屏幕底部有一个文本输入,按下时会扩展为更大的部分,并带有一些选项。bottomHeightheight在键盘打开时增加。

当按下额外容器中的这些预定义tags之一时,我不想关闭键盘,但我无法使其工作并且可以使用一些帮助。

我已经将它包装textinput在一个滚动视图中以尝试使用keyboardShouldPersistTaps,并keyboardDismissMode按照其他地方的建议,但它不起作用。

没有要更新的父 ScrollViews、ListViews 或 FlatLists,但是这个组件在里面Modal,由SafeAreaView

0 投票
0 回答
65 浏览

reactjs - react-native-modal 中模式活动时如何访问背景

我正在尝试实现一个页面,其中页面的顶部是静态的,底部不断变化。我能够使用 react-native-modal 来实现这一点。但问题是始终应该位于页面顶部的后退箭头按钮在整个过程中都无法访问。即使模式处于活动状态,我也想访问该按钮。任何帮助都将不胜感激,因为它在任何地方都不可用,我浏览了与此相关的整个 react native 和 react-native-modal 文档

0 投票
1 回答
1033 浏览

reactjs - 更改 react-native-modal-datetime-picker 上的分钟增量

我正在使用react-native-modal-datetime-picker时间选择器。我想将分钟 间隔更改为15 分钟而不是 1 分钟。这可能吗?谢谢!

0 投票
0 回答
255 浏览

android - Touchables 在 android (RN) 上无法以模态方式工作

我正在使用以下包 ( https://github.com/react-native-community/react-native-modal ) 在我的 RN 应用程序中创建模态。

在模态框内,我有一些按钮:TouchableOpacity 和 TouchableWithoutFeedback,它们都是从react-native-gesture-handler.

问题:按钮在 iOS 上有效,但在 Android 上无效。模态外的按钮在两个平台上都有效,但在 Android 上不在模态中。

将 import from 更改为react-native-gesture-handler从 self 导入 touchablesreact-native并不能解决问题。

以前有人遇到过同样的问题吗?

0 投票
0 回答
113 浏览

react-native - 在屏幕内呈现模态

我正在创建一个使用MaterialBottomTabBar的应用程序,并且在主屏幕中我有一个应该打开<Modal>.

在调查了很长一段时间后,我发现在使用标签栏时我无法呈现模式。我试图将模式放在我所有的标签栏屏幕中(没有任何成功)。然后将模态移到另一个不包含在选项卡栏中的屏幕上,模态工作得非常好。

如您所见,我正在使用 React Native HooksuseState(false)并在 Modal 中引用它。但是每当我点击<TouchableOpacity>模态时,都不会出现。

笔记!如果我更换模态将呈现

但是会立即运行,这在我的情况下不是一个选项。您知道如何在屏幕内运行此模式吗?