React 学习——useEffect 清除副作用

清除副作用的函数 最常见的执行时机是在组件卸载时自动执行

import { useEffect, useState } from "react"

function Son(){
  useEffect(()=>{
    const timer = setInterval(()=>{
      console.log('定时器');
    },1000); 
    // 清除副作用
    return () => {
      clearInterval(timer)
    }   
  },[])
  return (
    <div>son组件</div>
  )
}

function App(){
  const [show,setshow] = useState(true);
  return (
    <div>
      { show && <Son />}
      <button onClick={()=>setshow(false)}>卸载son组件</button>
    </div>

  )
}
export default App