出于测试目的，我应该避免使用e.target吗？

Question

我经常写这样的组件：

<input
    ref="ckbx"
    type="checkbox"
    checked={this.props.checked}
    onChange={() => this.props.onChange(this.refs.ckbx.checked)}
/>

但是，我现在发现这很难进行单元测试。 特别是，当使用Simulate.change或Simulate.click时，回调将传递复选框的初始值而不是新值（如浏览器中所示）。 当我将{ target: { checked: false } }添加为每个Simulate调用的第二个参数时，此行为仍然存在。

如果我改为使用

，它会起作用

<input
    type="checkbox"
    checked={this.props.checked}
    onChange={e => this.props.onChange(e.target.checked)}
/>

所以，我的问题是

• 这是首选方式来编写输入逻辑吗？
• 这是编写输入逻辑的唯一单元可测试方法吗？ 它真的看起来不灵活（如果我需要考虑多个参考？）。
• 我可以使用现有的方法吗？
• 我应该更换所有组件吗？ （不难，但如果有更好的方法，我不想这样做。）

Answer 1

正如您在link中看到的，他们只使用e.target，我也总是使用e.target输入。 我强烈建议您尽量避免在React中使用refs。首先，因为React团队称之为“逃生舱”。而且 - React docs

使用e.target可以模拟事件，它应该可以正常工作。