react事件 报错Cannot read property 'setState' of undefined

import React, { Component } from "react";

export class TestHanderClick extends Component {
  //有构造器state写在里面, 构造器中必须要有super并且传递参数
  constructor(props) {
    super(props);
    this.state = {
      num: 100,
    };
  }

  myChuFa() {
    alert("被触发了");
    // 报错 Cannot read property 'setState' of undefined
    // 说明state这个对象是未定义的,如何解决呢

    this.setState({
      num: this.state.num + 10,
    });
  }

  render() {
    //   this是这个组件
    return (
      <div>
        <div>{this.state.num}</div>
        <div onClick={this.myChuFa}> 我是事件</div>
      </div>
    );
  }
}

export default TestHanderClick;


初次看这个代码是没有问题的,但是你会点击后会发现报错
报错 Cannot read property 'setState' of undefined
说明state这个对象是未定义的,如何解决呢
只需要将
<div onClick={this.myChuFa}> 我是事件</div>

改成为
<div onClick={this.myChuFa.bind(this)}> 我是事件</div>
posted @   何人陪我共长生  阅读(1036)  评论(0编辑  收藏  举报
编辑推荐:
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 一个奇形怪状的面试题:Bean中的CHM要不要加volatile?
· [.NET]调用本地 Deepseek 模型
· 一个费力不讨好的项目,让我损失了近一半的绩效!
阅读排行:
· 百万级群聊的设计实践
· 永远不要相信用户的输入:从 SQL 注入攻防看输入验证的重要性
· 全网最简单!3分钟用满血DeepSeek R1开发一款AI智能客服,零代码轻松接入微信、公众号、小程
· .NET 10 首个预览版发布,跨平台开发与性能全面提升
· 《HelloGitHub》第 107 期
点击右上角即可分享
微信分享提示