Tour搭配Modal使用导致无法点击下一步

[luxi18]

Reproduction link

Steps to reproduce

将Tour与Modal搭配一起使用
代码如下：
<Button type="primary" onClick={() => setOpen(true)}> Begin Tour </Button> <Modal title="Basic Modal" open={open} onOk={handleOk} onCancel={handleCancel} okButtonProps={{ disabled: true }} cancelButtonProps={{ disabled: true }} > <div id="tourConment" style={{ width: '100%', height: '100&' }}> <Space> <Button ref={ref1}> Upload</Button> <Button ref={ref2} type="primary"> Save </Button> <Button ref={ref3} icon={<EllipsisOutlined />} /> </Space> </div> </Modal> <Tour open={open} onClose={() => setOpen(false)} steps={steps} getPopupContainer={() => document.getElementById('tourConment')} />
使用Tour属性getPopupContainer后mask图层会遮挡Tour的下一步按钮
注销getPopupContainer={() => document.getElementById('tourConment')}这一行代码后又可以点击下一步按钮

What is expected?

如上，使用了getPopupContainer后，Tour的mask在Modal的弹窗内

What is actually happening?

如上，使用了getPopupContainer后，Tour的mask任然在body上，且Tour因为mask层级zindex问题，导致不能点击下一步

Environment	Info
antd	5.16.4
React	18.3.0
System	window 10
Browser	Chrome 124.0.6367.62

[stackblitz]

Start a new pull request in StackBlitz Codeflow.

• react-zbmzv8 (Open reproduction)

[luxi18]

mask图层有问题

[wanpan11]

不应该把引导模块，挂载到 modal 里面，这样的话他的层级就变低了。

[wanpan11]

在 modal 的 afterOpenChange 里面控制 Tour 是否显示可以避免动画造成的定位问题

[zombieJ]

当年设置 container 时，元素的 zIndex 也会被上层 zIndex 影响。这是浏览器原生逻辑，按照 @wanpan11 提到的不要设置即可哈。