• 카테고리

    질문 & 답변
  • 세부 분야

    프론트엔드

  • 해결 여부

    미해결

리액트 시작하기 부분에서 계속 막히네요 코드는 제대로 입력한거같은데 버튼이 생성이 안되고있습니다.

22.12.26 22:46 작성 조회수 1.05k

1

<html>
    <head>
        <title>이규정의 블로그</title>
        <link rel="stylesheet" href="styles.css">
    </head>
    <body>
        <h1>이규정의 블로그에 오신 여러분을 환영합니다!</h1>

        <div id="root"></div>

        <!-- 리액트 가져오기 -->
        <script src="https://unpkg.com/react@17/umd/react.development.js" crossorigin></script>
        <script src="https://unpkg.com/react-dom@17/umd/react-dom.development.js" crossorigin></script>

        <!-- 리액트 컴포넌트 가져오기 -->
        <script src="MyButton.js"></script>
    </body>
</html>
function MyButton(props) {
    const [isClicked, setIsClicked] = React.useState(false);

    return React.createElement(
        'button',
        { onClick: () => setIsClicked(true) },
        isClicked ? 'Clicked!' : 'Click here'
    )
}

const domContainer = document.querySelector('#root');
ReactDom.render(React.createElement(MyButton), domContainer);

무엇이 문제인지 봐주시면 감사드리겠습니다.

 

답변 1

답변을 작성해보세요.

0

안녕하세요, 소플입니다.

올려주신 코드를 살펴보니 MyButton의 가장 마지막줄에 오타가 있네요~

아래와 같이 ReactDom => ReactDOM으로 수정하시면 됩니다!

ReactDOM.render(React.createElement(MyButton), domContainer);
멘탈재생님의 프로필

멘탈재생

2022.12.26

감사합니다!!