React component (부모 컴포넌트란?!)

부모 컴포넌트란 하나 이상의 자식 컴포넌트를 가지고 있고, 그에게 상태를 전달하고, 필요한 경우 상태를 업데이트한다..

음.. 뭔가 직관적이지 않은 느낌이랄까..? 뭔지는 알겠는데 설명하기 어려운 부분..?

그래서 gpt와 함께 공부를 해봤다. 

 

우선 부모 컴포넌트는 1, state관리, 2,데이터 전달(props로 전달) , 3, UI 상태 조정의 역할을 합니다.

즉, state를 가지고 있으면 부모 컴포넌트로 봐도 되는 것 같아요. 예로 useState, useReducer등등.

 

import React, { useState } from 'react';
import ChildComponent from './ChildComponent';

const ParentComponent = () => {
  const [count, setCount] = useState(0); -> 상태 관리 중

  const incrementCount = () => {
    setCount(count + 1); -> incrementCount라는 함수를 통해 count 상태를 업데이트하는 중
  };

  return (
    <div>
      <p>Count: {count}</p>
      <button onClick={incrementCount}>Increment</button> 
      <ChildComponent count={count} /> --> props로 값 전달
    </div>
  );
};

export default ParentComponent;

 

-> 즉, 부모 컴포넌트는 데이터의 소유자이기 때문에 이를 관리하고, 전달하는 역할을 하는 것입니다. 

 

그냥.. 둘러싸고 있는 거, 둘러 쌓여있는 거.. 이런 뜻이니까 더 직관적인 단어 없나.

만두와 만두소.. 뭐 이런 거.... 흑흑...