반응형
1. JSX, ReactDOM.render
- {formatinfor(student)} - 중괄호 표시 이유
=> html코드 안에서 어느부분이 javascript문법인지 인지 하기 위한 표시 방법. (JSX문법)
- ReactDOM.render(element, document.getElementById('root'))
=> ReactDOM에 있는 render함수를 통해 root라는 id를 가진 HTML컨트롤에 대해 element라는 변수 내용을 출력.
2. Props
2-1.
- Show함수의 디폴트 속성값 선언.
- Show함수의 Props(속성) 명시. (name = "황민국")
2-2.
- board변수 선언(화면에 보여질 데이터)
- props안에 user에 담겨진 값 세팅
- 명시된 props값 세팅
- board props값 명시
3. State (변경될 수 있는 데이터를 처리할 때 효율적)
- constructor선언 후 super통해 props초기화, state초기값 설정.
- state초기 설정 이후 재설정 시 setState를 통한 재설정.
- state의 date변수값 세팅. button onClick속성에 goBack함수 설정.
4. 이벤트 바인딩
- 초기화 영역(생성자)에서 해당함수에 대한 바인딩 처리.
- handleClick함수 선언 isToggleOn값을 반대로 처리.
- button태그의 onClick속성에 handleClick 함수 선언.
반응형