React类组件页面空白问题：使用构造函数无控制台报错排查

你的代码存在几个关键错误，导致页面空白无内容，逐一说明：

1. React.Component 拼写错误 #

类继承时，React. Component的点号后多了空格，正确写法是React.Component，否则无法正确继承React组件基类。

2. ReactDOM 拼写错误 #

渲染组件时用了ReactDom，正确的全局对象名是ReactDOM（DOM的字母D需要大写），拼写错误会导致找不到渲染方法。

3. 渲染参数传错 #

ReactDOM.render的第一个参数需要传入组件实例，你直接传了Strick_这个组件类，应该改成<Strick_ />（JSX语法）或者React.createElement(Strick_)。

4. JSX文本写法优化（可选） #

render返回的JSX里，文本与表达式混写时无需额外空格包裹，直接拼接即可，避免显示多余空格。

修复后的完整代码： #

class Strick_ extends React.Component {
  constructor() {
    super();
    this.state = { color: "red" };
  }
  render() {
    return <h1>This color is {this.state.color}</h1>;
  }
}
ReactDOM.render(<Strick_ />, document.getElementById("root"));

内容的提问来源于stack exchange，提问作者ankit chauhan