如何在 Semantic-react-ui 中在模态屏幕上显示弹出窗口？

Question

我正在使用语义 UI 库在模态框上显示一些内容。模式上方有一个按钮，单击该按钮后我们会看到一个提供一些信息的弹出窗口。挑战在于弹出窗口出现在模态屏幕后面。我怎样才能把弹出窗口放在模态框前面。我尝试了谷歌搜索，但目前没有有效的解决方案。

我也尝试了 z-index。是的 Sir.I 使用内联样式将值为 1 的 zindex 赋予模态，将值为 999 的 zIndex 赋予 Popup。喜欢下面-

//Modal.js
render(){
<Modal style={{zIndex:1}}>
          <MyComponent />
</Modal>
}

//MyComponent.js
render(){
<Popup
       trigger={<Button> Click Me! </Button>
       style={{zIndex:999}}>
<Popup.Content>
     Hi There. I am Popup content
</Popup.Content>

不幸的是，它没有用。 :(

注意 - Modal 和 Popup 都是语义 UI 库本身可用的组件。

Popup

Modal

Answer 1

 <Popup
     style={{ zIndex: 9999999 }}
 />

将 zIndex 应用于 Popup。保持高于模态的 zIndex 保持它大于 ui-dimmers zIndex，即 99990.

如何在 Semantic-react-ui 中在模态屏幕上显示弹出窗口？

How to show the Popup over the Modal screen in Semantic-react-ui?

javascript

reactjs

semantic-ui