React 시작하기 2

 

 

App.js의 Render에서 리턴해줬던 걸 해석해서 id가 root인 위치에 넣어줬다

 

 

 

바로 전 포스팅에서도 작성했지만

클래스에서 함수를 만들 땐, 화살표 함수를 사용해야 그 안에서 this 사용이 가능하다

 

 

 

 

Vue, React 에선 아이디 속성을 잘 주지 않는다 (그런 패턴이 잘 보이지 않음)

왜냐하면 SPA 기반으로 만들어서 하나의 페이지에서 아이디는 겹칠 수 없고,

애플리케이션 전체에서 유일해야 하는데 이를 SPA에선 특히 관리하기 쉽지가 않기 때문이다

그래서 아이디 대신 클래스 사용이 많다

 

 

 

a와 b는 다르다

그래서 새로운 배열의 참조값을 얻어내야 하는데, 이는 기존 배열에 아이템을 추가해서 새로운 배열의 참조값을

얻어내는 것이다. 이렇게 하는 방법이 펼침 연산자... 또는 concat을 이용하면 되는데

보통 concat을 더 많이 사용한다고 한다

 

 

 

 

JSX에서 import 한 걸 가져다 놓기

 

 

 

 

부모에게 props로 받을 수 있다

 

 

 

 

fortuneToday 키값으로 사용할 때 프로퍼티스를 전달해주면 된다.

밑에선 문자열을 전달한다

 

 

 

 

state 값을 지정해줘도 가능하다.

 

 

 

 

버튼을 클릭하면

setState로 인해 값이 바뀌어서 들어간다

 

 

 

 

운세 바꾸기 버튼을 클릭하면 동쪽으로 가면 귀인을 만나요 에서 다음 주면 수료를 하게 될 거예요 로 바뀐다

 

 

 

 

이렇게도 전달이 가능하다!

 

 

 

 

 

send 함수를 직접 호출하면서 msg로 값을 전달한다

 

 

 

 

1~4까지 모두 같은 실행결과를 가져오는데

가장 긴 1번을 map 함수를 통해 4까지 줄이는 게 가능하다