ReactDom未定义。

Question

我正在使用React、Webpack和Babel。我遇到了一个运行时错误：

未捕获的引用错误：ReactDom未定义

我的React版本是：

"devDependencies": {
   "phantomjs-polyfill": "0.0.2",
   "react-addons-test-utils": "^0.14.8"
 },    
 "dependencies": {
   "react": "^0.14.7",
   "react-dom": "^0.14.7"
 },

我的代码是：

import React from 'react';
import ReactDOM from 'react-dom';
import Main from './components/main';

ReactDom.render(<Main />, document.getElementById('root'));

我做错了什么？

- Yaniv Efraim

Answer 1

您拥有 ReactDOM，但没有 ReactDom(区分大小写)

ReactDOM.render(<Main />, document.getElementById('root'));

- Oleksandr T.

---

你是一个传奇 :) - Pradap Pandian

那么，那有什么区别呢？ - Sebastian Paduano

Answer 2

ReactDOM 与 ReactDom 不相同。你可以做两件事来解决这个问题。

import React from 'react';
import ReactDOM from 'react-dom'; // you used 'react-dom' as 'ReactDOM'
import Main from './components/main';

ReactDom.render(<Main />, document.getElementById('root')); // you referred to it as 'ReactDom' which is wrong.

因为ReactDOM != ReactDom。所以您需要修复其中一个位置，以使两个位置具有相同的名称和相同的大小写。

建议的修复方法是：

import React from 'react';
import ReactDOM from 'react-dom'; // this is recommended 
import Main from './components/main';

ReactDOM.render(<Main />, document.getElementById('root'));

或者您可以这样做：

import React from 'react';
import ReactDom from 'react-dom';
import Main from './components/main';

ReactDom.render(<Main />, document.getElementById('root'));

- prime

Answer 3

你的代码中有一个小错误，你写成了ReactDom而不是ReactDOM。 正确的代码如下：

import React from 'react';
import ReactDOM from 'react-dom';
import Main from './components/main';

ReactDOM.render(<Main />, document.getElementById('root'));

- Avinash Singh