ReferenceError:CustomEvent未在NextJS项目中定义

Question

我得到错误：ReferenceError: CustomEvent is not defined。我知道CustomEvent只在浏览器(客户端(中可用，但我正在尝试将此功能用作事件：

const mouseEnterHandler =  () => {
eventDispatcher('cursor', {
label: 'test',
})
}
onMouseEnter={mouseEnterHandler()}
export const eventCreator = (name: string, params: Record<string, any>): CustomEvent => {
const event = new CustomEvent(name, {
detail: params
})
return event
}
export const eventDispatcher = (name: string, params: Record<string, any>): CustomEvent => {
const event: CustomEvent = eventCreator(name, params)
document.dispatchEvent(event)
return event
}

Answer 1

export default function SomePage({ props }) {
useEffect(() => {
window.addEventListener('test-event', (event) => {
console.log('test-event', event);
});
window.dispatchEvent(new CustomEvent('test-event', { detail: { test: 'testing' } }));
});
}

Answer 2

把它放在useEffect挂钩中，它就会工作。