ReactJS - 覆盖按钮放在列表上方时不可点击 [英] ReactJS -- Overlay Button not Clickable when placed above a List

问题描述

请参阅我创建的代码沙箱中的代码示例

Please see the Code Example in Code Sandbox I have created

我想让浮动按钮的按钮动作触发。但是相反，分配给ListItem的Action被触发。
任何Ideas解决方案都将受到高度赞赏。

I want the button action of the Floating Button to fire. But instead the Action assigned to the ListItem is triggered. Any Ideas solution will be highly appreciated.

谢谢！

Thanks!

推荐答案

这是一个标记/造型问题，而不是一个JS问题。你可以做的最简单的事情是在溢出容器上设置一个z-index。

It's more a markup/styling issue than a js problem. The easiest thing you can do is set a z-index on the overflow container.

const overlay = {
    position: 'absolute',
    bottom: 30,
    right: 10,
    zIndex: 100
}

这可以让你的例子工作，但也许有更好的标记解决方案来解决你的问题。

This makes your example working, but maybe there are better markup solutions to solve your problem.

这篇关于ReactJS - 覆盖按钮放在列表上方时不可点击的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！