[React] States Props

1. Props

- props는 부모(상위) 컴포넌트에서 자식(하위) 컴포넌트로 전달되는 데이터

- 부모(상위) 컴포넌트에서 받는 데이터이기 때문에 변경이 불가능함.

- 부모 요소에서 값을 설정하며, 초기값과 자료형에 대한 유효성 검사가 가능함. 

 

-프로퍼티에 문자열을 전달할 때에는 큰따옴표를, 문자열 외에는 중괄호({})를 사용한다.

 

function App(){
return(
	<main id="hi"/>
    );
 }

 

 

function Main(props){
return(
	<h1> {props.main} </h1>
   );
  }

 

 

2. State

- state는 한 컴포넌트 안에서 유동적인 데이터를 다룰 때 사용되며, 데이터 변경이 가능함. 

- 컴포넌트 내부에서 선언되기 때문에 외부에 공개되지 않음.

- 주로 상태에 따라 변화하는것, 함수를 통해 값을 변경해야할 때 사용함. 

import React,{useState} from 'react';

const [변수, set함수]=useState(초기값);

- set함수를 사용하면 해당하는 값을 변경할 수 있음.

- 동적인 데이터를 다룰 때 사용함.