Next.js Discord

Discord Forum

"Window is not defined" even in useEffect

Unanswered
Pembroke Welsh Corgi posted this in #help-forum
Open in Discord
Pembroke Welsh CorgiOP
Here is my code in a useEffect but i'm still getting "window is not defined". Please help
const useIsMobile = (size: number = 768): boolean => {
  const [width, setWidth] = useState(typeof window !== undefined ? window?.innerWidth : 0);

  // create an event listener
  useEffect(() => {
    typeof window !== undefined ? setWidth(prev => prev + window?.innerWidth) : null;
    let timeoutId: NodeJS.Timeout | undefined = undefined;
    //choose the screen size 
    const handleResize = () => {
      // prevent execution of previous setTimeout
      if (typeof window !== undefined) {
        clearTimeout(timeoutId);

        timeoutId = setTimeout(() => setWidth(window.innerWidth), 150);
      }
    }

    typeof window !== undefined ? window.addEventListener("resize", handleResize) : null;

    return () => {
      typeof window !== undefined ? window.removeEventListener('resize', handleResize) : null;
    }
  }, [])

  return (width <= size);
}

export { useIsMobile };

1 Reply

Pembroke Welsh CorgiOP