14. XML의 큰 장점 중 하나가 사용자 정의 태그를 사용할 수 있다는 점입니다.
JSX(Javascript XML)
React 에서 위와 같은 방식으로 사용할 수 있습니다.
Virtual DOM를 사용해서 빠른 효과를 얻는 것 뿐만 아니라 <div></div>와 같은
의미없는 마크업을 줄일 수 있는 부가적인 효과도 얻을 수 있습니다.
16. 1. 모든 React.Component 에는 render 메소드가 있는데, 이 메서드는 컴포넌트가
어떻게 생길지 알려줍니다.
2. ReactDOM은 실제 페이지에 JSX 형태의 코드를 렌더링 할 때 사용합니다.
[ 규칙 ]
1. 컨테이너 엘레멘트 하위에 존재해야한다.
2. 번수 : 사용 { } 를 사용
3. 스타일 : 카멜케이스
4. 주석 { /* … */ }
JSX를 사용보자.
17. Props
- 부모 컴포넌트에서 자식 컴포넌트로 내려오는 데이터에서 사용한다.
- 컴포넌트 내부의 변하지 않는 데이터를 다룰때 사용한다.
- 읽기 전용(Readonly)처럼 사용된다.
18. State
- 컴포넌트 내부에서의 유동적인 데이터를 표현할 때 사용
- 초기 설정이 필수: 생성자(constructor)에서 this.state = { }
- 값 수정시에는 this.setState({...})로 진행
19. 자식 Element에서 부모 Element로
Data 를 전달하려면?
function을 넘겨서 event 통해서 조작한다.
24. shouldComponentUpdate
prop 혹은 state 가 변경 되었을 때, 리렌더링을 할지 말지 정하는 메소드입니다.
componentWillUpdate
컴포넌트가 업데이트 되기 전에 실행됩니다.
이 메소드 안에서는 this.setState() 를 사용하면 무한루프에 빠져들게 됩니다.
componentDidMount
컴포넌트가 만들어지고 첫 렌더링을 다 마친 후 실행되는 메소드입니다.
이 안에서 다른 JavaScript 사용하거나 AJAX 처리 주로 넣습니다.