Name: useEffect cleanup function
Uploaded: 2024-09-19T19:59:15.261Z
Duration: 8 min 18 s
Description: useEffect cleanup function

scrimba

Watch in fullscreen

useEffect cleanup function

by Bob Ziroll

About

Comments

Notes

useEffect cleanup function

by Bob Ziroll

Expand for more info

WindowTracker.jsx

run

preview

console

import React from "react"

export default function WindowTracker() {
    const [windowWidth, setWindowWidth] = React.useState(window.innerWidth)
    
    React.useEffect(() => {
        window.addEventListener("resize", function() {
            setWindowWidth(window.innerWidth)
        })
    }, [])
    
    return (
        <h1>Window width: {windowWidth}</h1>
    )
}

import React from "react"

export default function WindowTracker() {

const [windowWidth, setWindowWidth] = React.useState(window.innerWidth)

React.useEffect(() => {

window.addEventListener("resize", function() {

setWindowWidth(window.innerWidth)

})

}, [])

return (

<h1>Window width: {windowWidth}</h1>

)

}

-8:17