我的React演示中的按钮点击无反应

Question

为什么点击按钮后没有反应？

我的示例代码： https://codesandbox.io/s/gallant-knuth-kwf55c

我检查了我的代码，没有找到问题，请帮忙解决一下。

Answer 1

原因是，由于所有元素都使用position:absolute设置，内容div与页眉重叠。

这导致交互时隐藏了页眉。所以当我们点击时，实际上是在内容上触发了点击事件，而不是按钮（请参见下文）。

我们可以采取以下几种方法：

• 要么从DIV中移除position:absolute
• 使用CSS 视口单位 / calc函数计算内容的高度，以避免与页脚重叠