React React 如何实现点击空白部分关闭弹框

ytp · October 18, 2021 · Last by ytp replied at November 22, 2021 · 697 hits

最近学习了 react,心血来潮下想封装几个组件,但遇见了这个问题:不使用遮罩的情况下,react 怎么实现点击空白部分关闭弹框?

document.addEventListener('click')

你放个透明遮罩就可以了

一般的思路是:

  1. document 上绑定事件
  2. 利用事件代理的思路 (直接点就是检测:event.target,得到目标元素,非 modal 元素)
  3. 需要处理的问题是:modal 出来之后,哪些事件关闭,哪些事件忽略
5 Floor has deleted

https://devdocs.io/dom/node/contains

判断点击元素是不是在组件内,不在就关闭?

You need to Sign in before reply, if you don't have an account, please Sign up first.