visibilitychange

브라우저 탭의 변경을 감지하는 Event

react 에서

사용 예)

const component () => {

  useEffect(()=>{
    const tabChangeHandler () => {console.log('tabChange')}
    document.addEventListener('visibilitychange',tabChangeHandler)
  
    return ()=>{}
  }, []);


return <div>React</div>
}

위와같은 이벤트리스너를 useEffect에 포함하고 있다면 해당 페이지를 보다가 브라우저 탭을 눌러 페이지를 변경하거나, 최소화 또는 최대화를 포함한 다양한 화면전환시에도 해당 이벤트를 실행 된다.