问题标签 [react-modal]

我有一个包含许多项目集合的应用程序，在管理区域，管理员用户可以删除或修改项目（如传统的电子商务网站后台）。在逻辑上，为了修改一个项目，用户点击“修改项目”按钮，一个模式打开。

我的问题是我无法在单击按钮上打开模式，因为当我单击“修改项目”按钮时，我的浏览器会显示一条错误消息：“TypeError：无法读取未定义的属性'setState'”

我使用 react-modal-responsive 来完成这项任务。

我已经被困了好几天了，如果你能帮助我，我会非常高兴。预先感谢。

这是我的代码：

我实际上在我的第一个反应应用程序上工作。这是一个收藏应用程序。在这个应用程序上，有一个管理仪表板，包含应用程序的所有项目，管理员用户可以删除或修改项目（就像传统的电子商务后台一样）。对于修改项目，管理员用户单击“修改项目”按钮，并打开一个用于修改项目信息的模式。

我的问题是当用户打开模态时，模态工作正常，但我无法传递所选项目的信息（如品牌、参考、价格......）。很抱歉在同一天再次提出问题，但我尝试了很多东西，但没有结果。一点帮助是非常受欢迎的。

先感谢您，

这是我的代码：

我想使用 React js modal 获取动态内容，我正在使用包 react-responsive-modal。首先，我通过地图渲染所有帖子。现在我希望当我单击单个帖子时，模式应该弹出并只显示该特定帖子的标题和正文。现在我不知道如何在模态中获取单个帖子。是否可以通过第三方包做到这一点，或者我必须为此制作自定义模式？

我正在使用 reactstrap 模态，有 ModalHeader 我正在显示我的内容。但是当我试图将该内容放在标题中心时，我遇到了这个问题。

在检查元素后，我发现在 ModalHeader 中有<h5>标签，在这个标签内我的内容即将到来，我检查了<h5>标签没有使用 Modal-Header 的全宽。我认为因为它没有进入中心。如果有人知道 reactstrap Modal，请指导我如何将我的 Modal-Header 内容放在中心。在此先感谢。

这是我的示例代码。

我正在尝试构建一个react-modal用于提供提示的测验。我需要在测验中使用多个模态。我是 React 新手，所以我很可能犯了一个简单的错误。

我不确定这是否重要，但我已经使用create-react-app.

我的 App.js 看起来像这样：

hintModal.jsx 看起来像这样：

这就是问题所在：我需要根据hint传递给 HintModal 的道具来更改模态的内容。当我hint从 outside输出时<Modal>，它会按预期运行，显示道具的值。但是当我hint在其中输出时，当任一模式被激活时<Modal>，它会返回“banana”（hintHintModal 的第二个实例的道具的值）。

任何帮助将不胜感激！

我建立了一个反应自定义模式。通过单击打开按钮 showModal 变为真，使显示块和关闭按钮使显示不显示。

但是我在刷新页面时注意到了一个错误，模式的内容在屏幕上显示了几毫秒。

这是我的应用程序的重要功能之一。

这是视频链接https://youtu.be/A6CUmSzwobY

和

codepen link https://codepen.io/alligatorio/pen/aYzMKL?editors=0100

如果有人能指出问题以及如何解决，我将不胜感激。

我正在尝试在我的反应应用程序中单击按钮时在模态窗口中播放 youtube 视频。我正在为模态使用“react-modal-window”节点模块。我正在获取一组 youtube 视频 ID，并通过以下方式将 ID 传递给模态，但模态窗口仅获取数组中的最后一个 ID。但是，如果我尝试打印视频 ID，则会获得相应的 ID。有人可以帮忙解决这个问题吗？

要查看输出，请单击此链接 - https://7jrz33j35x.codesandbox.io/ 选择所有四个产品并单击比较按钮。比较显示的表格视图。在最后一行，每个产品都有一个“观看视频”按钮。在按钮旁边，显示了相应的 id（用于调试目的），但是在单击观看视频时，会播放数组中最后一个 id 的视频

我的项目中有一个循环，它显示了我的 Firebase 数据库中存在的所有项目。我为此使用 Lodash 和 renderPosts 方法，就像您在以下代码中看到的那样：

另外，我希望当用户单击修改按钮时，会打开一个可以修改项目的模式。为此，我使用“React-Responsive-Modal”和以下代码：

要在我的模式中检索我必须修改的项目的信息，我必须将它们传递到我的“onOpenModal”函数中，以更新我的状态。但我不能传递信息。我尝试了我能想象的一切，但我找不到。你有想法吗 ？

先感谢您

我首先进行 Ajax 调用（对 API），它为我提供了一些数据、成就列表（对象数组）。我想遍历这个数组，将第一个成就显示为模态，然后单击按钮关闭模态，然后显示下一个（下一个成就）等等。

提供数据的 Ajax 调用：

在这里，我展示了模态：

目前所有的Modal同时打开。单击“收集”按钮后，如何一个接一个地打开它们？

仅限野生动物园

我在桌面 Safari 上遇到了奇怪的错误。我想在滚动网站时达到某个点后显示模式。不幸的是，当我们在 safari modal 上这样做时，它是不可点击的（z-index 问题？）。我一直在使用 react + react-modal，但我认为这个问题与任何一个都无关。

源码+demo：https ://codesandbox.io/s/p5x9331y8x

我注意到，当我们在其中包装触发功能时，setTimeout()我们将能够看到模态仅在滚动事件出现时才停止工作。https://codesandbox.io/s/3q7rmpj1mq

OfcsetTimeout()不是这里的解决方案......我发现了与此相关的问题，但其中任何一个都与我的问题不完全匹配：

• https://github.com/reactjs/react-modal/issues/369
• https://css-tricks.com/forums/topic/safari-for-ios-z-index-ordering-bug-while-scrolling-a-page-with-a-fixed-element/

此外，当没有overflow: hiddenon body 时，它可以正常工作，但这也不是解决方案（显然我们想防止背景滚动）。

注意：关于demo，到达页面最后一段后会出现模态（这个问题是重新创建的）。最好全屏打开页面进行测试。

任何帮助将非常感激。