ReactDom 未定义

Question

我正在将 React 与 Webpack 和 Babel 结合使用。我收到运行时错误：

Uncaught ReferenceError: ReactDom is not defined

我的反应版本是：

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

我做错了什么？

Answer 1

您有 ReactDOM 但没有 ReactDom（区分大小写）

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

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

Answer 3

您使用 ReactDom 而不是 ReactDOM 编写的代码中存在一个小错误。正确的代码应该在下面给出：

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

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

ReactDom 未定义

ReactDom is undefined

javascript

reactjs

webpack

babeljs

react-dom