弹框外部点击关闭

import React, { useLayoutEffect, useRef } from 'react'

export default function ceshi() {
  const as = useRef(null)
  const handleCl =()=>{
    window.addEventListener("click", (e) => {
      
      if (e.target != as.current) {
        console.log(e.target);
      }
    });
  }
  useLayoutEffect(() => {
    handleCl()
  }, []);
  return (
    <div>
      <div style={{width:'100px',height:'100px',border:"1px solid red"}}></div>
      <button>点击</button>
    </div>
  )
}