[React.js] State와 Props

 

 

리액트 컴포넌트에는 여러 개의 state가 들어올 수 있음

→ https://mm-study-front.tistory.com/38

 

 

리액트는 prop라는 기능이 있어서 상속이 편리

→https://mm-study-front.tistory.com/36

[React.js] Props

 

그렇다면 부모컴포넌트와 자식컴포넌트의 state 변화는 어떻게 될까???

 

우선 리렌더링이 되는 경우는 3가지가 있다

1. 자신의 state 값 변화할 때

2. 자신이 제공 받는 props값이 변화할 때

3. 부모컴포넌트가 리렌더링이 되면 자식 컴포넌트도 리렌더링

 

 

그렇기 때문에 자식 컴포넌트 입장에서는 자신과 관련 없는 state여도 부모 컴포넌트 state 변화가 생겨 리렌더링 되면

본인까지도 리렌더링

 

즉 컴포넌트 두개가 계속 리렌더링 된다

 

이게 한 두개면 상관이 없지만

부모컴포넌트에 여러 개의 props, 부모컴포넌트 자체의 여러 state, 자식 컴포넌트의 여러 state가 생긴다면

 

수도 없는 리렌더링이 발생해 애플리케이션의 능력을 저하시킨다

 

 

이를 막기 위해서는

https://mm-study-front.tistory.com/33

[React.js] React 컴포넌트 만들기

에 나온 것 처럼

컴포넌트 자체를 여러 파일로 나누어 모듈화 하면 해결 가능하고

메인.jsx의 코드의 수도 줄고 오류가 나면 정확히 어디서 난지 발견하고 해결하기 쉽다