在 React 应用中，给事件处理函数传参通常有哪几种方式？请说明各自的写法与适用场景。

回答思路

1. 【回答框架 1】React 事件处理函数默认接收事件对象 event，若需额外参数，常用箭头函数包裹或使用 bind 方法。箭头函数写法为 onClick={(e) => handleClick(id, e)}，bind 写法为 onClick={handleClick.bind(this, id)}，两者均可在调用时传入自定义参数。
2. 【回答框架 2】箭头函数会自动绑定当前组件实例的 this，且参数传递直观，性能上每次渲染会创建新函数，但通常影响可忽略；bind 方式在每次渲染也会创建新函数，且需注意 this 绑定，更推荐在构造函数中预先绑定或使用类属性箭头函数。
3. 【回答框架 3】若需同时访问事件对象和自定义参数，箭头函数中先传自定义参数再传 event，bind 中 event 会自动作为最后一个参数传入。对于大量列表项，可考虑将参数封装进数据对象或使用 data 属性减少内联函数创建。
4. 【回答框架 4】在函数组件中，还可通过柯里化或自定义 Hook 封装传递逻辑。核心在于理解事件对象位置、this 绑定及性能取舍。
5. 【关键点 1】箭头函数传参：onClick={(e) => handleClick(id, e)}，直观且 this 自动绑定。
6. 【关键点 2】bind 传参：onClick={handleClick.bind(this, id)}，event 自动作为末位参数。
7. 【关键点 3】避免在渲染中过度创建新函数，必要时使用 useCallback 或稳定引用优化。
8. 【易错点 1】bind 方式若忘记绑定 this 会报错，且每次渲染生成新函数，影响子组件 memo 优化。
9. 【易错点 2】直接写 onClick={handleClick(id)} 会在渲染时立即执行，而非点击时执行。