我试图将一个按钮完全放在iframe上，但是当我在移动的网络上查看我的应用时，没有按钮点击被注册，而是在它下面的iframe上注册了一次点击。
在非移动网络上也可以使用完全相同的实现。
Here is a picture of the implementation for visualization purposes
下面是我目前使用的代码

<div style={{ width: '100vw', height: '100vh', display: 'flex', position: 'relative' }} />
   <button
      style={{ position: 'absolute', top: 0, bottom: 0, zIndex: 1  }}
      onClick={() => console.log('button clicked')}
   >
      click here
   </button>

   <iframe style={{ width: '100%' }} src={src} />
</div>

我还尝试过其他一些方法：

• 将iframe的z-index设置为一个较小的数字（iframe仍然被单击）
• 在iframe上禁用pointer-events（按钮点击仍未注册）
• 将按钮 Package 在div中
• 将iframe Package 在div中
• 单击按钮时停止传播