React - 생활코딩(7) State관리 + Props

■ 사용자 & 구현자

1) State :  구현자가 사용자를 위한 system의 상태관리를 위한 것

2) Props : 사용자 입장에서 보여지는 component API를 조작하기 위한 것

 

 

■ Component를 state로 관리하기

> State는 App.js 등에서 주는 값으로 치환

> Component라는 class + props를 한 객체로 바라보고, state에서 props로 가지는 값을 하위 component에 주입하는 방식

> 상위 App의 State를 하위 Component로 전달하는 방식

state가 하위 component로 전달되는 방식

 

사용자가 보는 부분과 은닉된 App.js안의 component 구성 방식

※ Props + component 활용된 부분

 

 

■ Class의 Super란?

1) 정의 :

클래스를 생성할 때, 부모 클래스의 기능을 활용해서 메서드나 변수를 선언할 때 super를 사용

 

2) 사용 :

class를 생성할 때 constructor 매써드가 호출되므로,

이 매써드를 선언하여 overriding + 불리도록하고 이 함수 안에서

super( arg1, arg2, .... ) 를 사용하여 부모 클래스의 constructor를 init하여 부모 클래스의 기능 등을 활용할 수 있도록 함

※ React의 경우 props가 Component 클래스에서 활용되는 듯

 

> Component 상속 + super ( )

> Component의 constructor

props를 받는 것을 알 수 있음

state라는 것을 가지는 것을 알 수 있음

JS Class의 super 추가 참조 : Link

 

---

참조 :

www.youtube.com/watch?v=rOpg2KUPW2M&list=PLuHgQVnccGMCRv6f8H9K5Xwsdyg4sFSdi&index=16

www.youtube.com/watch?v=e2c1EUcW7oo&list=PLuHgQVnccGMCRv6f8H9K5Xwsdyg4sFSdi&index=17