React Class Component修改App.js后不更新，页面空白求助

你的类组件代码里有个语法错误，这就是浏览器显示空白的原因：

看这一行：

class App extends Component() {

这里Component后面的括号是多余的！React类组件继承Component基类时，直接写extends Component就行，不需要加括号调用。

修正后的代码如下：

import { 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" />
         <p>Hi, John</p>
         <p>This is another para</p>
         <button>Click to Change</button>
         
        </header>
      </div>
    );
  }
  
}

export default App;

函数组件能正常运行是因为它的写法没有语法错误，而类组件的这个小错误会导致React无法正确解析组件，最终渲染失败显示空白。作为新手，写类组件的时候要注意继承基类的语法细节，别多加不必要的符号。

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