React中的事件绑定的四种方式

1.在构造函数中绑定事件

javascript 复制代码
 constructor(props) {
    super(props);
    this.handleClick = this.handleClick.bind(this);
  }

2.在调用时显式绑定

javascript 复制代码
<button onClick={this.handleClick.bind(this)}>Click me</button>

3.使用箭头函数

javascript 复制代码
 handleClick = () => {
    console.log('Button clicked');
  };

  render() {
    return <button onClick={this.handleClick}>Click me</button>;
  }

4.直接传入一个箭头函数

javascript 复制代码
<button onClick={() => this.handleClick("1"}>Click me</button>;
相关推荐
掘金安东尼3 分钟前
🧭前端周刊第437期(2025年10月20日–10月26日)
前端·javascript·github
浩男孩9 分钟前
🍀【总结】使用 TS 封装几条开发过程中常使用的工具函数
前端
Mintopia15 分钟前
🧠 AIGC + 区块链:Web内容确权与溯源的技术融合探索
前端·javascript·全栈
晓得迷路了18 分钟前
栗子前端技术周刊第 103 期 - Vitest 4.0、Next.js 16、Vue Router 4.6...
前端·javascript·vue.js
Mintopia19 分钟前
🚀 Next.js Edge Runtime 实践学习指南 —— 从零到边缘的奇幻旅行
前端·后端·全栈
GISer_Jing25 分钟前
不定高虚拟列表性能优化全解析
前端·javascript·性能优化
Predestination王瀞潞40 分钟前
WEB前端技术基础(第三章:css-网页美化的衣装-上)
前端·css
鹏多多44 分钟前
深度解析React中useEffect钩子的使用
前端·javascript·react.js
超级大只老咪44 分钟前
CSS基础语法
前端
冰暮流星1 小时前
css之box-sizing属性
前端·javascript·css