Question

我有一个非常简单的反应组件：

import React, {Component} from 'react';

class Hello extends Component {
  render() {
    return <div>
      <h1>Hello Freewind</h1>
      <div>
        <button ref="button1" onClick={() => alert('1')}>Click 1</button>
        <button ref="button2" onClick={() => alert('2')}>Click 2</button>
      </div>
      <div>
        <button onClick={this._clickBoth.bind(this)}>Click both</button>
      </div>
    </div>;
  }

  _clickBoth() {
    this.refs.button1.click();
    this.refs.button2.click();
  }
}

export default Hello;

单击“同时单击”按钮时，将以编程方式单击“单击1”和“单击2”按钮。奇怪的是，我会看到6个警报：

哪个应该是

1
2

但是，如果我删除_clickBoth中的任意一行，例如删除this.refs.button2.click();，它就会正确行为并且只显示一条提醒：

您可以在此处查看并尝试项目：https://github.com/js-demos/react-ref-demo

Answer 1

我不确定是什么问题，但我肯定想知道它背后的技术性。

与此同时，如果您正在寻找解决问题的方法，可以将按钮点击在PackageInfo p = a.PackageManager.GetPackageInfo(a.ApplicationInfo.PackageName, PackageInfoFlags.MetaData); TextView lastUpdated = messageView.FindViewById<TextView>(Resource.Id.lastUpdated); DateTime dt = new DateTime(1970, 1, 1, 0, 0, 0, 0, System.DateTimeKind.Utc); lastUpdated.Text = "App Updated on " + dt.AddMilliseconds(p.LastUpdateTime).ToLocalTime().ToString("MM-dd-yyyy");内，如下所示：

setTimeout

Answer 2

也不确定发生了什么，但我在_clickBoth处理程序中添加了一个console.log并获得了以下结果：

click both
click both
click both
1
2
1
click both
click both
2
1
2

为什么单击ref按钮3次？

2 个答案: