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

Question

我正在使用语义UI库在Modal上显示一些内容。在Modal上方有一个按钮，单击该按钮后，我们会看到一个弹出窗口，提供一些信息。挑战是弹出窗口出现在Modal屏幕后面。如何将弹出窗口带到Modal前面。我试着用谷歌搜索，但目前没有有效的解决方案。

我也尝试过z-index。是的，先生。我使用内联样式将zindex的值1赋给modal，并将值99999的zIndex赋给弹出窗口。就像下面这样-

//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。要保持高于modal的zIndex，请保持高于ui调光器的zIndex，后者为99990。