수집되지 않은 참조 오류: ReactDOM이 정의되지 않았습니다.

수집되지 않은 참조 오류: ReactDOM이 정의되지 않았습니다.

Rails 어플리케이션을 가지고 리액트 레일 젬을 설치하고 셋업하여 테스트 어플리케이션을 실행해 보겠습니다.

새로 설치되었을 때 hello world 프로그램을 실행하려고 하면 다음 오류가 발생합니다.

수집되지 않은 참조 오류: ReactDOM이 정의되지 않았습니다.

제 반응은 이렇습니다.

var HelloWorld = React.createClass({
  render: function() {
    return (
      <p>
        Hello, <input type="text" placeholder="Your name here" />!
        It is {this.props.date.toTimeString()}
      </p>
    );
  }
});

setInterval(function() {
  ReactDOM.render(
    <HelloWorld date={new Date()} />,
    document.getElementById('example')
  );
}, 500);

/app/assets/javascripts/components/test.js.jsx 파일에 저장됩니다.

Ruby 2.2.3 탑재 레일 4.2.4

철자 문제일 수 있습니다.ReactDOM,것은 아니다.ReactDom.

이는 React의 새로운 릴리스에 따라 변화하고 있습니다.

ReactDOM버전 0.14.0 이후부터 사용 가능하기 때문에React.render(React 버전 0.13.3이 있기 때문에) 대신

setInterval(function() {
  React.render(
    <HelloWorld date={new Date()} />,
    document.getElementById('example')
  );
}, 500);

또는 업그레이드 할 수도 있습니다.React버전 및 포함ReactDOM

반응 0.14의 변화

수입하셔야 합니다.

import ReactDOM from 'react-dom';

다음을 포함했는지 확인합니다.react-dom.jsCDN에서 추가하거나 js 툴체인을 사용할 수 있습니다.

리액트 설치 - CDN 사용

<script src="https://unpkg.com/react@15/dist/react.js"></script>
<script src="https://unpkg.com/react-dom@15/dist/react-dom.js"></script>

Make sure it's ReactDOM (case sensitive)

          class App extends React.Component {
            render() {
                return (
                    <div>
                        <div className="commentbox">Hello React ! </div>
                    </div>
                );
            }
        }
        ReactDOM.render(<App />, document.getElementById('root'));

제대로 작동하려면 세 가지를 해야 합니다.

1. 개발에 필요한 CDN Import(웹 개발의 경우 리액트 및 리액트 도메인 사용)

<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>

2. 설치하다babel-cliJSX를 vanila js로 컴파일하기 위해 필요합니다.

3. 코드의 오타를 변경합니다.

그렇다.ReactDOM, Raact가 아닌돔

언급URL : https://stackoverflow.com/questions/33125669/uncaught-referenceerror-reactdom-is-not-defined