⭐
🍌
☁️
✨
‹ 返回课程
自定义 Hook
编程代码 · React/Next.js
💡 自定义 Hook:封装防抖逻辑,延迟更新值减少频繁计算
function useDebounce<T>(value: T, delay: number): T {↵// 定义泛型 Hook,接收值和延迟毫秒数
const [debounced, setDebounced] = useState(value);↵// 内部状态保存防抖后的值
useEffect(() => {↵// useEffect 监听值变化
const timer = setTimeout(() => setDebounced(value), delay);↵// 设置定时器:延迟后才更新防抖值
return () => clearTimeout(timer);↵// 清理函数:值变化时取消上一个定时器
}, [value, delay]);↵// 依赖数组:值或延迟变化时重新执行
return debounced;↵// 返回防抖后的值
}// Hook 定义结束
0 字/分0% 准确
🐵
f左手食指
ESC 暂停⌫ 退格