본문 바로가기

props2

[React] 기초 개념 (3) props 하위 컴포넌트한테 properties를 넘겨줄 수 있다. 이때 커스텀한 HTML 속성을 사용한다. Array props 넘기기 대괄호를 이용해서 배열을 넘겨줄 수 있다. 하위 컴포넌트에서 받을 때는 join()과 같은 배열 함수를 이용하여 props에 접근할 수 있다. const ChildComponent = (props) => {props.colors.join(', ')} green, blue, red 기본 props props에 기본 값을 설정할 수 있다. 기본 값을 설정하면 따로 props를 정의하지 않아도 설정해 놓은 값으로 정의된다. 하지만 값으로 null을 전달하면 기본 값이 아닌 null로 정의된다. 예상하는 props를 정의하도록 propTypes를 사용한다. 리액트는 컴포넌트가.. 2023. 4. 16.
[React] props의 간단 개념 React는 컴포넌트 단위로 쪼개서 구현을 한다. 컴포넌트에서 컴포넌트고 값을 주고 받을때 props를 사용한다. props는 properties의 줄임말이다. 상위 컴포넌트에서 정의를 하고, 하위 컴포넌트에 전달을 한다고 가정하자. /* index.js */ function index(){ return ( ) } 상위 컴포넌트에서 하위컴포넌트의 태그 안에 값을 넣어준다. /*Hello.js*/ function Hello(props){ const name = {props.name}; console.log(name); } 하위 컴포넌트는 괄호() 안에 props으로 값을 받아온다. props이 아닌 name으로 받아와도 된다. (여기에서 name인 이유는 상위 컴포넌트에서 Hello 태그 안에 name을 .. 2023. 3. 12.