antd-mobile
Version:
<div align="center">
18 lines • 564 B
JavaScript
import { useEffect } from 'react';
// 监听点击组件外部的事件
function useClickOutside(handler, ref) {
useEffect(() => {
function handleClick(event) {
if (!ref.current || ref.current.contains(event.target)) {
return;
}
handler(event);
}
// 在捕获阶段监听,以确保在事件被阻止传播之前触发
document.addEventListener('click', handleClick, true);
return () => {
document.removeEventListener('click', handleClick, true);
};
}, [handler, ref]);
}
export default useClickOutside;