Javascript 未捕获的 ReferenceError：ReactDOM 未定义

Uncaught ReferenceError: ReactDOM is not defined

提问by IvRRimUm

So i have Rails applications, i installed react-rails gem, set it up and try to run test application.

所以我有 Rails 应用程序，我安装了 react-rails gem，设置它并尝试运行测试应用程序。

Freshly installed, when i tryed to run hello world program, this error hapened:

全新安装，当我尝试运行 hello world 程序时，出现此错误：

Uncaught ReferenceError: ReactDOM is not defined

未捕获的 ReferenceError：ReactDOM 未定义

This is my react:

这是我的反应：

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);

Its saved inside /app/assets/javascripts/components/test.js.jsx file.

它保存在 /app/assets/javascripts/components/test.js.jsx 文件中。

Rails 4.2.4 With Ruby 2.2.3

Rails 4.2.4 与 Ruby 2.2.3

采纳答案by Alexander T.

ReactDOMavailable since version 0.14.0, so you need to use React.render(because you have a React version 0.13.3) instead,

ReactDOM从版本0.14.0 开始可用，所以你需要使用React.render（因为你有一个 React 版本0.13.3），

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

or upgrade your Reactversion and include ReactDOM

或升级您的React版本并包括ReactDOM

Changes in React 0.14

React 0.14 的变化

回答by Adam

It may be the spelling issue - it is ReactDOM, not ReactDom.

这可能是拼写问题 - 是ReactDOM，不是ReactDom。

This has changed over time with the new release of React

随着 React 的新版本的发布，这种情况随着时间的推移发生了变化

回答by Kay

You have to import it

你必须导入它

import ReactDOM from 'react-dom';

回答by Seppo Ervi?l?

Make sure that you've included react-dom.js. You can add it from CDN or use js toolchain of your choice.

确保您已包含react-dom.js. 您可以从 CDN 添加它或使用您选择的 js 工具链。

Installing React - using a CDN

安装 React - 使用 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>

回答by Anand Raja

To make it work properly, you have to do 3 things.

要使其正常工作，您必须做 3 件事。

1. Import the CDNs, necessary for the developement(Say react and react-dom for web development)

1. 导入开发所需的 CDN（比如 web 开发的 react 和 react-dom）

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

1. install babel-cli. It is needed for the compilation of JSX into vanila js

2. change the typo in your code,

2. 安装babel-cli。需要将 JSX 编译成 vanila js

3. 更改代码中的错字，

it is ReactDOM, not RaactDOM

它是ReactDOM，而不是 RaactDOM