[220610 / Day 27] props, usestate

02 폴더 메인피드

aws : 서버 구축, 데이터베이스 손 쉽게 만들어 넣을 수 있게 만든 자동화 프로그램

 

풀옵스? : props, 상위 컴포넌트에서 하위 컴포넌트로만 전달 가능 형제도 안됨 병렬도 안됨. 컴포넌트가 복잡해지면 많이 힘들어짐 그래서 리덕스나 컨택트 사용 / 프로퍼티 이름을 정하고 값을 전달 / const TxtFeed = (props) => { à 여기서 props 는 정해진 것이 아니라 다른 걸 써도 됨, props 라는 변수에 이메일, 바디, 네임이 들어가 있는 거고 각각 그 안에 {props.name} 이라고 하면 각각 그 데이터가 불러와짐

이미지가 있는 데이터에는 이미지피드로 : 삼항연산자로

 

구조분해 할당? test 폴더

 

 

 

state : 컴포넌트의 상태, 컴포넌트의 상태를 생성하고 업데이트 시킬 수 있는 도구 제공

const [state, setState] = useState( 초기값 );

à useState 에 생성과 동시에 가져야 할 초기값을 인자로 넣어주면 state 와 setState 라는 두가지 요소를 배열 형태로 리턴

à 현재 상태값은 state 라는 변수에 들어있고 state 를 변경시켜주고 싶을 때는 setState 함수를 이용해서 간편하게 변경 가능, state 와 setState 의 이름은 마음대로 지정 가능

 ex) const[time, setTime] = useState(5); à 컴포넌트 안에 time 이라는 state 가 생기고 초기값은 5 / 여기서 초기값을 변경하려면 setTime(6) 이라고 setTime 함수에 6 을 넣어주면 6 으로 변경할 수 있음

 

 

훅?

 

변수가 증가하고 감소했을 때는 상태의 변화를 감지하지 못함

유즈 스테이트도 변수 기본으로 설치되어 있는 메서

상태의 변화를 읽어낼 수 있는 변수

상태가 변했을 때 재렌더가

어떤 상태의 변화를 알려주고

스테이트에 담아서 변수를 사용하면 바로바로 읽어올 수 있음

 

진짜 돔을 사용해서 매번 다시 읽어오기 때문에 업데이트 가능

반면 리액트는 리액트는 가상돔과 비교해서 그 부분만 수정

 

메서드 훅: