Zlog
首页时间轴关于
Zlog

一个探索技术、编程和构建 Web 的个人空间。

© 2026 Zlog

导航

首页时间轴关于

链接

首页/处理 JSX 中函数调用

处理 JSX 中函数调用

虽然期望的是传递函数引用,然而实际上是函数调用,为了解决这个问题通常存在一些解决方案。

Z

Zephyr110

2019年12月28日·1 分钟
|
frontendfrontend-javascript

问题

jsx
<button onClick={this.setKey(key)} />

虽然期望的是传递函数引用,然而实际上是函数调用,为了解决这个问题通常存在一些解决方案。

解决

1. 传递一个函数引用

jsx
<button onClick={() => this.setKey(key)} />

2. 函数修改为闭包

jsx
vm = {
  setKey(key) {
    return () => console.log(key);
  }
}
 
<button onClick={this.setKey(key)} />

3. 使用 bind 方法

jsx
<button onClick={this.setKey.bind(this, key)} />

标签

frontendfrontend-javascript

评论

相关文章

Facade

外观模式:就是提供一个统一的接口去访问多个子系统的多个不同的接口,为子系统中的一组接口提供统一的高层接口。使得子系统更容易使用,不仅简化类中的接口,而且实现调用者和接口的解耦。

2021年12月26日·2 分钟

Singleton

单例模式:就是在整个运行时域,一个类只有一个实例对象。

2021年12月26日·2 分钟

Function Overloading

函数名相同,函数的参数列表不同(参数个数、参数类型),根据参数的不同之行不同的操作。

2021年12月19日·2 分钟

← 返回文章列表