大家都熟悉useEffect hook，有时候useLayoutEffect更合适。
用过useInsertionEffect的人并不多，我们来探索一下。
hook 的 API 和 useEffect 非常相似，需要在 setup 函数、依赖数组中添加代码，并且可以返回一个清理函数。
React 文档给出了这个描述。
useInsertionEffect 适用于 CSS-in-JS 库作者。
它可用于其他目的，主要是在组件安装时运行一些代码，例如将事件侦听器添加到窗口。
React.useInsertionEffect(() => {
initShiki().then((highlight) => {
setHtml(highlight(content));
});
}, [content]);
useInsertionEffect(() => {
const popCb = () => {
const newVal = parse(filterUnknownParamsClient(defaultState));
state.current = newVal
};
window.addEventListener(popstateEv, popCb);
return () => {
window.removeEventListener(popstateEv, popCb);
};
}, []);
useInsertionEffect(() => {
const cb = () => {
_setState(stateMap.get(stateShape.current) || stateShape.current);
};
const unsub = subscribers.add(stateShape.current, cb);
return () => {
unsub();
};
}, []);
以上是`useInsertionEffect` React hook 的用例的详细内容。更多信息请关注PHP中文网其他相关文章！
