일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | ||
6 | 7 | 8 | 9 | 10 | 11 | 12 |
13 | 14 | 15 | 16 | 17 | 18 | 19 |
20 | 21 | 22 | 23 | 24 | 25 | 26 |
27 | 28 | 29 | 30 |
- javascript
- 개발공부
- React
- component
- EXTJS
- springboot
- 자바
- 데이터베이스
- 자바스크립트
- sql
- 보안취약점
- DATABASE
- Intellij
- 쿼리
- 컴포넌트
- restapi
- table
- jdk
- java
- Spring
- JS
- GIT
- 리액트
- 스프링
- 스프링부트
- reactjs
- 개발
- crud
- Vue
- mssql
- Today
- Total
목록Props (2)
준준의 기록일지

잘 설명된 props, state 블로그 trustyoo86.github.io/react/2017/11/18/props-state-react.html kern의 FE-Note kern의 Front-end 개발 노트입니다. trustyoo86.github.io props, state의 차이점을 통해 state를 알아보자. props : 사용자가 컴포넌트를 사용하는 입장에서 중요 -> 사용자가 컴포넌트를 조작할 수 있게 한다. (외부) state : props의 값에 따라 내부 구현에 필요한 데이터. -> 사용자가 알 필요 없는 부분. (내부) 두 부분 외부, 내부를 철저하게 분리하는 것이 중요하다. state는 컴포넌트가 다양한 일들을 할 수 있게 만든다. props에 하드코딩 된 값을 state로 만들고..

App.js에 컴포넌트를 만들때 render( return ( 하나의 최상의 태그만 넣어야 한다 ) ) 해당 그림은 유사 자바스크립트로 js랑 비슷하지만 html 규격에 맞게 까다롭게 정의하는 부분을 과감히 생략하는 느낌? jsx로 코드를 작성하면 create-react-app이 javascript 코드로 converting해준다. 각 구문을 컴포넌트화해서 방대한 양의 코드가 있어도 간결하고 가독성이 높아진다. 여기서 예를 들어 와 같이 같은 세개의 컴포넌트를 넣으면 3개가 각각 들어가겠지만, 중복된 값이 들어간다는 아쉬움이 있다. 이를 해결하기 위해 react는 props라는 속성을 가지고 있다. (html 의 attribute 속성과 비슷하다고 함) - 해당 구문은 react의 속성을 이용해서 위에 ..