Javascript 在某些div中显示antd模式掩码

通常，当您打开modal时，遮罩（即modal后面的黑色背景）会覆盖整个屏幕。 如果我想在某个div中渲染黑色对话框，如何实现，如下图所示？（红色分区说） 我使用的是antd模式

---

这在antd中是不可能的

Ant Design将模态装载到DOM的一个单独部分，位于React的主DOM树之外，类似于React门户。这是处理模态、灯箱等的标准方法

---

您必须实现自己的覆盖，该覆盖完全约束到其父容器。

通常，模式会安装到文档主体。（这是

标记。）但是，可以使用

getContainer

属性更改此行为。看

下一个问题是模式（和遮罩——或“黑色背景”）的位置“固定”，这意味着它固定在浏览器窗口上。我们需要将它改为“绝对”位置，这样它就可以相对于我们要安装它的div

见工作示例：

---

我想我已经根据自己的需要修改了您的示例，请检查：（还有CSSfile）是否可以？PS还有，这个代码沙盒有时会抛出这样的警告：“警告：unmountComponentAtNode（）：您尝试卸载的节点是由React呈现的，不是顶级容器。相反，请让父组件更新其状态并重新呈现，以便删除此组件”--希望这与代码无关，而与沙盒相关