React⛅️의 기능적 컴포넌트🔥

2771 단어
컴포넌트는 반응 애플리케이션의 기본 빌딩 블록입니다. 반응에는 두 가지 유형의 구성 요소 기능 구성 요소와 구성 요소 클래스가 있습니다. 여기서는 기능적 구성 요소에 대해 설명합니다.

기능 구성 요소 정의



자바스크립트 함수로 정의할 수 있는 기능적 컴포넌트.props 함수에서 구성 요소에 전달하려는 속성을 포함할 것입니다.


function Welcome(props) {
  return <h1>Hello, {props.name}</h1>;
}


기능 구성 요소의 사용.


Welcome as <Welcome/> 와 같이 함수 이름을 태그로 포함하는 다른 구성 요소 내부에 함수를 정의할 수 있습니다.

속성을 구성 요소 태그의 속성으로 전달할 수 있습니다.


function Welcome(props) {
  return <h1>Hello, {props.name}</h1>;
}

function App() {
  return (
    <div>
      <Welcome name="Sara" />
      <Welcome name="Cahal" />
      <Welcome name="Edite" />
    </div>
  );
}

좋은 웹페이지 즐겨찾기