React组件报错：Uncaught TypeError: Class extends值未定义非构造函数或null

• 核心错误原因：类继承时错误地将React.Component作为函数调用，代码中class Boss extends React.Component()的写法有误，正确写法应为extends React.Component（去掉后面的括号）。调用React.Component()会返回undefined，导致继承的是一个无效值，从而触发类型错误。

• 额外需要修正的问题：

  • 方法名拼写错误：handlClick应改为handleClick
  • JSX中需使用className替代原生HTML的class属性，避免与JavaScript关键字冲突

修复后的完整代码：

import React from 'react';
import ReactDOM from 'react-dom/client';

class Boss extends React.Component {
    handleClick() {
        alert('我是主页');
    }

    render() {
        return (
            <div className="goto">
                <button onClick={this.handleClick}>点击测试</button>
            </div>
        );
    }
}

const root = ReactDOM.createRoot(document.getElementById('root'));
root.render(<Boss />);

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