javascript - 下一个JS : how to use window in custom hook?

Question

ReferenceError: 窗口未定义

当 NextJS 尝试呈现页面时，服务器端会出现此错误。但是您可以在 useEffect Hook 中使用 window，如 here 所示。 .

我的问题是如何创建自定义 Hook 。我试过这样的事情:

export const useEventListener = (
    target: EventTarget, event: string, listener: EventListenerOrEventListenerObject, trigger = true,
): void => {
    useEffect(() => {
        target.addEventListener(event, listener);
        trigger && target.dispatchEvent(new Event(event));
        return () => target.removeEventListener(event, listener);
    });
};

这里的window是在useEffect中使用的。但是我得到了错误，因为当我调用

useEventListener(window, 'scroll', () => {...});

NextJS 无法识别它。

我该如何处理？

Answer 1

我不确定该解决方案是最好的，但是您可以使用 globalThis 代替 window，它等于 window客户端。