본문 바로가기
IT News/React & nodejs

React 컴포넌트 with 클래스

by 지표쌤 2021. 10. 11.
반응형

일반적으로 React 에서 컴포넌트를 만들때

에로우 함수를 사용하여 아래와 같이 구현을 하는데요.

클래스 형태로 컴포넌트를 사용하는 방법도 어렵지는 않습니다.


const App = () => {

    return (

        <div>

            <div className='container'>

                <Header />

            </div>

        </div>

    )

}


클래스는 class 라는 키워드와 함께 extends 를 사용하고 React.Component 를 하고

중괄호로 묶어주고 render 함수안에 구현을 하면 됩니다.

컴포넌트가 함수 형태 이든 클래스 형태이든 아직은 공부하는 중이라서 크게 차이는 모르겠지만

프로그래밍을 공부해오신 분들이라면 class 형태를 더 권장하실 수도 있을것 같습니다.


class App extends React.Component {

    render() {

        return (

            <div>

                <div className='container'>

                    <Header />

                </div>

            </div>

        )

    }

}


React Class entends React.Component

반응형