代码之家  ›  专栏  ›  技术社区  ›  Vithursa Mahendrarajah

一次点击反应连续校准功能

  •  0
  • Vithursa Mahendrarajah  · 技术社区  · 6 年前

    我需要基于一个onClick事件执行两个函数。为此,我通过stackoverflow找到了一些方法。(参考 Call multiple functions onClick ReactJS )

    但是,如果我指定 onClick={this.handleClick} 按预期工作。但如果我指定 onClick={(event) => {this.handleClick()}} ,单击按钮时不会发生任何事情。这可能是什么原因? 当第二个函数调用取决于第一个函数调用的结果时,一个一个地调用两个函数的最佳方式是什么。

    3 回复  |  直到 6 年前
        1
  •  1
  •   Manoz    6 年前

    你可以试试下面的

    你的 onClick 默认情况下会发送一个事件

    onClick={this.handleClick}
    

    手淫事件

    handleClick = (event) => {
      fetch.fetchUrl(url [, options], ()=> {
       this.getFoo();
      })
    }
    getFoo = ()=>{}
    

    第二条路

    可以通过绑定函数发送事件

    onClick={this.handleClick.bind(this, additionalParameter)}
    

    现在click函数看起来像

    handleClick = (additionParameter, event) =>{}
    

    另外,如果您想同时发送其他参数,可以使用第二种方法。这两种方法仍然会传递与处理程序关联的事件。

        2
  •  1
  •   fdreger    6 年前

    在Javascript中, this 不是为一段代码静态定义的(类似于99%的其他语言),而是从调用上下文中获取的(即,它是动态范围的),因此它可以根据调用函数的人和时间而有所不同。

    在第二种情况下, 计算延迟:调用函数时。在第一种情况下,在附加事件时对其进行评估(因此它是“正确的”)。

    解决方案是简单地使用第一个版本-延迟调用它没有任何好处(无论如何,事件将作为第一个参数传递)。

        3
  •  0
  •   MadhuriJain    6 年前

    在第二个函数中调用第一个函数应该可以工作。PFB步骤-

    1. 定义第一个函数。
    2. 在第二个函数定义中,首先调用第一个函数,并相应地使用第一个函数输出,以便在第二个函数定义中执行进一步的操作语句。
    3. 在单击事件时调用第二个函数。

    这将导致调用第二个函数,但将根据调用第一个函数时提供的输出执行操作。