Javascript React Js:mountNode未定义无未定义错误

我刚开始学英语。我找到了这个例子。但当我尝试第一个代码时：

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import ReactDOM from 'react-dom';

class HelloMessage extends React.Component {
  render() {
    return (
      <div>
        Hello {this.props.name}
      </div>
    );
  }
}

ReactDOM.render(
  <HelloMessage name="Taylor" />,
  mountNode
);
export default HelloMessage;

import React，{Component}来自'React'；
从“/logo.svg”导入徽标；
导入“/App.css”；
从“react dom”导入react dom；
类HelloMessage扩展了React.Component{
render（）{
返回(
你好{this.props.name}
);
}
}
ReactDOM.render(
,
mountNode
);
导出默认HelloMessage；

我得到了这个错误

./src/App.js第18行：“mountNode”未定义无未定义

搜索关键字以了解有关每个错误的更多信息

---

我已经看到了这个问题的答案。但很抱歉，我无法理解那里的解释。给我一些建议。提前谢谢你

您收到的错误消息是一个linting错误。（静态代码分析）

确保

mountNode

变量存在

或者使用类似于：

render(<HelloMessage />, document.getElementById('app'));

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';
//Passed the name props to the
ReactDOM.render(<App name = "Taylor"/>, document.getElementById('root'));
registerServiceWorker();

ReactDOM.render（）方法已位于下

src/index.js

比如：

现在，我们可以在同一个文件下编写HelloMessage组件，或者用HelloMessage组件替换应用程序组件，而不是呈现应用程序组件。我所做的是

import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';

class App extends Component {
  render() {
    return (
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <h1 className="App-title">Welcome to React</h1>
        </header>
        <p className="App-intro">
          To get started, edit <code>src/App.js</code> and save to reload.
        </p>
      </div>
    );
  }
}
//Added the HelloMessage Component
class HelloMessage extends React.Component {
  render() {
    return (
      <div>
        Hello {this.props.name}
      </div>
    );
  }
}
//Exported the HelloMessage Component to index.js file instead of App Component
export default HelloMessage;

之后，我可以在浏览器

localhost:3000

中看到Hello消息。但是Taylor的名字没有显示在那里……所以我所做的是从

index.js

文件中传递名字道具，类似于：

render(<HelloMessage />, document.getElementById('app'));

import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';
//Passed the name props to the
ReactDOM.render(<App name = "Taylor"/>, document.getElementById('root'));
registerServiceWorker();

---

即使我将和保留在ReactDOM.render（，document.getElementById（“app”））中，也要将

替换为

；它告诉我错误目标容器不是DOM元素。请将您的HTML代码发布为well@BharathRao正如Klugjo在他的回答中所说的，您需要定义mountNode，但是当我使用这个：类HelloMessage extends React.Component{render（）{return时，用于mountNode的任何id都必须出现在HTML元素中（）；}}ReactDOM.render（，document.getElementById（'app'））；我得到了这个错误：目标不是DOM容器ReactDOM.render（15 |，16 | document.getElementById（'app'）17 |）；
类HelloMessage扩展了React.Component{render（）{return（）；}
听起来不正确。你能用HTML+完整的react代码来更新你的帖子吗？mountNode可能只是一个div标记，但它必须存在。这通常是一个应该预先存在于你的HTML中的元素。像JSComplete这样的某些游乐场有预定义的代码供你尝试。我会在JSComplete.com/playery中尝试你的代码。这应该可以在那里正常工作，因为他们已经在那里设置了所有库。您应该能够在那里进行检查，并查看mountNode的外观。
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';
//Passed the name props to the
ReactDOM.render(<App name = "Taylor"/>, document.getElementById('root'));
registerServiceWorker();

import HelloMessage from './App' 
...