React/practise/31.hook/06.useEffect 清除副作用.jsx

import { useEffect, useState } from 'react'

function Test () {
    useEffect(() => {
        let timer = setInterval(() => {
            console.log('定时器执行了')
        }, 1000)

        return () => {
            // 清理定时器
            clearInterval(timer)
        }
    }, [])

    return (
        <div>this is test</div>
    )
}

function App () {
    const [flag, setFlag] = useState(true)
    return (
        <div>
            {flag ? <Test /> : null}
            <button onClick={() => setFlag(!flag)}>switch</button>
        </div>
    )
}

export default App