30일차 - React props, state

오늘의 주 공부내용 props, state + 이벤트 핸들러

이렇게 머리 싸매고 공부한건 코딩공부 시작한 이후 처음이었다.

<input type="textarea></input>

이런식으로 작성했는데 결국 답은

<textarea></textarea>

이런식으로 해야지 해결이 되는 거였다... 솔직히 똑같은거 아닌가?
이건 테스트 케이스가 정확히 일치하는 것만 찾아서 그런거 같다...

하지만 테스트 문제만 아니라도 React는 너무너무 어렵다. 그래도 공부하면 세상에 안될 것은 없다고 생각한다.
계속 공부하다 보면 언젠가 갑자기 이해가 되는 날이 올 것이다.

props

props는 컴포넌트의 속성을 의미한다.
변경되지 않는 값이며, 상위 컴포넌트로 부터 전달받은 값이다.

웹페이지로 치면, 회사명이 나와있는 Header부분이 대표적일 것 같다.

state

오늘의 주 공부 부분이다.
변하는 값으로 상품 주문을 할때, 상품의 수량, 가짓 수 등이 있을 수 있겠다.

const [state 저장 변수, state 갱신 함수] = useState(초깃값);

의 형식으로 생성을 한다.
state의 꽃은 이벤트 처리와 함쳐질 때다.
네이버 상품 수량 선택, 페이스북 좋아요, 토글버튼 등등 엄청 많은 것들이 state와 이벤트의 조합이다.

주로 쓰는 이벤트 처리는
onChange
onClick
이 있다.

리액트의 특징

전에 정리 못한 리액트의 특징을 추가로 적어보자면

하향식, 그리고 단방향 데이터 흐름을 가지고 있다는 것이다.

그래서 parents에다가 state를 넣어주면 children에서도 사용할 수 있다.