컴포넌트에 클릭 이벤트 적용방법
- 컴포넌트에 버튼을 만든다
- onclick={(e) =>{ alert('이벤트'); }} 인라인으로 직접 이벤트를 작성해줘도 되지만, 함수를 작성하여 컴포넌트에 함수를 연결해주었다
- 주의 * onclick 안에 함수를 연결해줄때 함수명(); 이런식으로 소괄호를 할 경우, 연결이 아닌 해당 함수의 호출이되어버린다
부모 자식 컴포넌트 연결하기
- 값을 보낼 부모 컴포넌트의 return에 자식 컴포넌트를 입력하면 부모, 자식 컴포넌트가 서로 연결되어 "나는 아들입니다" 메세지가 화면에 나온다
컴포넌트에 props 전달하기
- props란 컴포넌트끼리의 정보 교환 방식이다
- 부모 컴포넌트가 자식 컴포넌트에게 물려준 데이터, 컴포넌트 간의 정보 교류방법이다
- props는 반드시 위에서 아래 방향으로 흘러야 한다 부모 -> 자식 방향으로만 전달할수 있다
- props는 반드시 읽기 전용으로만 취급하며, 변경해선 안된다
prop drilling
- prop drilling이란 prop는 무조건 부모에서 자식으로 전달되어야한다
- 손자에게 값을 전해 주기 위해선 중간 컴포넌트를 거쳐 전달되어야한다
- 이것을 prop drilling ( prop 가 아래로 뚫고 내려간다 ) 라고 한다
children문법
children 활용1
children 활용2
state
onClick 이벤트
onChange 이벤트
map, filter 적용하기
컴포넌트 분리