问题标签 [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 投票
0 回答
328 浏览

react-native - 对话框未关闭

我正在使用react-native-modals在对话框中显示下拉列表。从下拉列表中选择项目后,对话框会自动关闭并在屏幕上显示所选项目的数据,但下拉列表中的某些项目没有各自的数据。对于这些项目,我应用条件来选择列表中的另一个项目,但在程序中应用条件后,对话框没有关闭,它保持在屏幕上,并在后台显示所选项目的数据。

这是我的代码

CityReducer.js 文件

0 投票
2 回答
880 浏览

react-native - 多项数据。使用 react-native 在动态模式中显示单击的数据

食物> PIZZA> 点击任何披萨会打开一个模式。我想显示在此模式中单击的比萨饼的信息。我看了很多类似的例子,但我无法摆脱它。所以我需要帮助。我在下面添加了部分代码。同时,代码在expo和下面的链接中都有

小吃.expo.io/@ibrahimyolbir/e48b05

手风琴

我在渲染内容中的打开模式按钮

模态

我的 Json 数据文件

食物屏风

0 投票
0 回答
163 浏览

reactjs - TypeScript 错误:尝试发布数据后未处理的 Promise Rejection

我在 flatlist 中创建了一个按钮 Add Margin ,用于将数据发布到后端,但是当我尝试发布它时会抛出 Unhandled Promise Rejection 错误。

我的添加边距功能如下:

我已按如下方式调用上述函数:

点击添加保证金后,我的日志是:

请帮助,并指出我做错了什么,如果您需要其他任何东西,请告诉我。

我的渲染方法如下:

0 投票
1 回答
118 浏览

react-native - 反应原生:模态不显示

我是 react-native 的新手,我正在尝试使用以下代码在 react-native 中显示模态

但它不起作用,谁能告诉我我的代码有什么问题,谢谢。

0 投票
1 回答
1214 浏览

react-native - 反应原生:无法将自定义高度设置为模态

我是 react-native 的新手,我正在尝试使用以下代码为模态提供自定义高度并在屏幕中居中。

0 投票
1 回答
6186 浏览

react-native - 如何像 instagram 一样实现模态向下滑动?

我目前正在开发一个 React Native 项目。我需要在 Instagram 上实现类似于“向下滑动关闭模态”的功能

0 投票
1 回答
379 浏览

react-native - React Native 中的应用程序模式

我目前正在使用react native modal,它的目的是显示模态。

我目前的问题是我想展示模态应用程序。例如,当收到推送通知时,无论用户在哪个屏幕中,我都想调用模式。模式的当前设计将其绑定到单个屏幕。

如何克服?

0 投票
1 回答
5131 浏览

reactjs - 反应原生模态时间延迟和生涩的动画

我正在尝试构建一个具有左右轮播的反应原生屏幕,在轮播的每个面板中都有一个带有项目列表的垂直平面列表。在平面垂直平面列表中最多有 8-10 个轮播面板和 5-30 个项目,因此在渲染的最多项目中可能有 300 个,但通常是 100 个。

我正在调用 API 并每 2-3 秒检查一次服务器上的数据,并使用新数据设置组件中的状态。这目前有效,并且子组件中的数据数据会按应有的方式更新。

flatlist 中的每个项目都是可点击的,这会触发在页面中启动的模式弹出窗口。我遇到的问题是模式弹出窗口需要 4-5 秒才能出现和关闭。此外,当模态最终开始消失时,动画会变得生涩,并且深色背景层似乎在被移除时闪烁。

我首先尝试使用内置模式并且还使用了 react-native-modal 包,两者都是相同的。

我尝试使用 InteractionManager.runAfterInteractions 和 shouldComponentUpdate(nextProps, nextState) 来尝试阻止我的 api 调用,直到动画完成或阻止我的 isModalVisible 状态属性在我更改它时导致重新渲染。

下面的代码,任何帮助将不胜感激。

尝试 1

我有一个想法,这可能是我使用了一个名为“react-native-snap-carousel”的第三方轮播库,所以我试图用一个看起来很糟糕的滚动视图替换它,并让我所有的平面列表/项目都在其中呈现,但这确实没有改善仍然是 2-3 秒的弹出时间延迟。

尝试 2

我发现了一个叫做 react.purecomponent 的东西,它可能应该对状态/道具进行浅层比较,并且只在项目/状态实际发生变化时触发重新渲染,这可能意味着动画/ui线程导致问题停止。但没有更好的(在模拟器和设备上)在模态显示之前仍然长时间停顿

尝试 4

通过在底部轮播下方的页面底部放置一个按钮来触发平面列表之外的模式,从而将平面列表排除在外。

这导致没有改进或性能。那么还有什么导致这个问题。是因为间隔导致我的组件不断重新渲染吗?因此,必须有一种方法可以暂停我缺少的组件重新渲染。任何人?

0 投票
1 回答
73 浏览

android - react-native 中具有透明背景的模态

如何在 App.js 中实现具有背景透明的模式。(它应该在背景中显示 android 屏幕而不是白色背景)

0 投票
1 回答
426 浏览

react-native - 模态内的反应原生 Flatlist 有时不显示数据

我正在尝试在 Modal 中使用 Flatlist 来获取数据。但有时(并非总是)数据根本不显示。只是空屏。我正在使用 expo 客户端进行测试。下面是我的代码。这个 render() 方法实际上是在一个自定义组件中。因此,Modal 位于自定义组件中。我不确定 Modal 是否必须在这里引起任何问题。