react useEffect(hook)

Posted on In ,

useEffect를 쓰는 이유1

간략하게 설명할 방법은 react가 render를 할때
그 내부에 있는 모든 useState와 기능들이 같이 실행되기 때문에 필요할 경우에만 쓰기위해 필요한 함수를 따로 담아서 쓸수 있는 장점이있다.
약간 promise 비슷한거 같기도 한 느낌

🤔 

1
useEffect(()=>OnlyOnce,[])

간략하게 이런식으로 쓰면 한번만 render할때 OnlyOnce라는 함수가 실행되고 실행이 되지 않는다

useEffect를 쓰는 이유2

사실 두번째 이유가 가장 크다
보통 useState와 같이 쓰는데 어떤 이벤트가 발생하였을때 이벤트가 실행될때마다 다른 함수도 자동적으로 실행되는 경우가 많기에 제약을 따로 줄 필요가 있다.

이럴때 

1
2
3
4
useEffect(()=> {
if(keyword!==""){
 console.log('search',keyword)
}}  ,[keyword])

keyword의 값이 변하지 않는다면 console.log(‘search’,keyword) 는 실행되지 않는다. 이와 같은 방식으로 검색앱 등을 만든다거나 어떤 이벤트를 잘 정렬하여서 순서를 만드는 것도 쉽게 가능하다고 생각한다.