20210628 React 컴포넌트

함수형 컴포넌트

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

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

• state가 없음
• state, lifeCycle 관련 기능사용 불가능 [Hook을 통해 해결 됨]
• 컴포넌트 선언이 편함

클래스형 컴포넌트

class Welcome extends React.Component {
  render() {
    return <h1>Hello, {this.props.name}</h1>;
  }
}

• state, lifeCycle 관련 기능 사용 가능
• render() 메서드가 꼭 있어야 함
• 임의 메서드를 정의할 수 있음