useMutationObserver
监听一个或多个 DOM 节点的结构或属性变化。
签名
ts
function useMutationObserver<T extends Node>(
targets: readonly ResolvableTarget<T>[],
callback: MutationCallback,
options: MutationObserverInit & {
enabled?: boolean;
},
): void;基本用法
关键行为
- targets 是目标数组,单个目标也需要写成
[target]。 - targets 中的每一项支持 DOM 对象、React ref、
null和undefined。 - 回调变化时不会重新创建观察器,内部会调用最新回调。
- 缺少
MutationObserver、targets 为空或enabled: false时不会执行任何操作。
注意事项
options会直接传给MutationObserver.observe,至少需要指定一个观察维度,例如childList、attributes或characterData。- targets 中重复的节点只会被观察一次。