props 와 state는 React에서 데이터를 사용할 때 다루는 개념이다.

state

• state는 컴포넌트 내부에서 관리하는 상태 값으로 데이터를 유동적으로 다룰 때 사용한다.
• state는 컴포넌트 내부에서 변경이 가능한 상태 값이다. 변경이 필요할 경우 setState() 함수를 통해 값을 변경해줄 수 있다.
  • 변경된 상태를 컴포넌트에게 알려주기 위해서 setState() 함수 사용
  • 변경될 때마다 컴포넌트가 자동으로 다시 렌더링된다.
• state는 props 와 다르게 자동으로 생성되지 않아 명시적으로 state를 기술 해야 한다.
• React의 컴포넌트는 상태 값(state)을 이용해서 UI를 표현한다.

props

props는 부모 컴포넌트가 자식 컴포넌트에 값을 전달할 때 사용하는 것이다.
읽기 전용(readonly)으로서, 자식 컴포넌트에서는 직접적으로 수정 할 수 없는 값이다.
props는 부모 컴포넌트에서 변경된다.

props의 단방향 데이터 흐름

React 에서 한 Component 에서 다른 Component 로 데이터를 전송할 때, 사용하는 특수 객체가 props 이다.
그러나 Props는 단방향으로 데이터를 전송한다는 특징이 있다.
그러므로 자식에서 부모로, 동일한 레벨의 Component로 Props를 전달하는 것은 불가능하다.

Props : 단방향, 데이터 변경 불가
State : 쌍방향, 데이터 변경 가능

Reference

https://minjung-jeon.github.io/React-props-state/
https://blog.naver.com/dnrwls123123/222940376992