[React] props

 

props는  부모의 데이터를 자식 컴포넌트에서도 사용할 수 있게 해준다.

1번 부모 컴포넌트안에  2번 자식 컴포넌트안에 3번 자식 컴포넌트가 있다.

 

2번 컴포넌트에서 1번 컴포넌트의 데이터를 사용하려면 props로 1번에서 2번으로 한번 전달하면 된다.

 

3번 컴포넌트에서 1번 컴포넌트의 데이터를 사용하려면 props로 1번에서 2번에서 3번으로 전달해야 한다.

 

 

 

 

 

 

props 사용법

 

 

1번의 데이터를 props 자식  컴포넌트에서 부모 컴포넌트의 데이터를 사용하고 싶으면 

 

 

props를 받으려는 자식 컴포넌트 사용하는 곳 안에  작명 = {  전송할 데이터  }

 

 

 

자식 컴포넌트 function에 인자로 props를 받고 부모 컴포넌트의 데이터를 사용할때는 props.작명 

 

 

 

 

 

 

 

 

 

그것을 또 자식 컴포넌트한테 props하려면 

 

 

 

현재 app 컴포넌트 안에 PropsComponent1 컴포넌트안에 PropsComponent2가 있다.

 

최상위 컴포넌트 app안의 데이터를 PropsComponent1 컴포넌트의 자식인 

 

PropsComponent2가 사용하려면 props로 2번 전달해줘야 한다.

 

 

 

 

data2 state 값을 PropsCompenent2에 전달하려면 먼저 PropsCompoent1에 전달하고

 

 

 

 

전달한 값은 props.data2 이기 때문에 그값을 또 PropsCompoent2에 전달한다.