reactjs - 验证 Office fabric react 文本字段

Question

我有一个包含一堆 office fabric textField 的页面控制。他们有自己的 onGetErrorMessage 方法来验证和显示错误消息。但我不想触发 onBlur 或 onFocusIn 的验证。我想在单击“保存”按钮时验证所有内容。我怎样才能访问控件并遍历这些控件并立即对其进行验证？控件不在标记中。

例如

<div>
    <div>
        <TextField label="First Name:" onGetErrorMessage={this._onError} />
    </div>
    <div>
        <TextField label="Last Name:" onGetErrorMessage={this._onError} />
    </div>
    <div>
        <TextField label="Email:" onGetErrorMessage={this._onError} />
    </div>
    <div>
        <TextField label="Username:" onGetErrorMessage={this._onError} />
    </div>
    <div>
        <input type="button" onClick={this.validate()} value="Save" />
    </div>
</div>

我尝试先初始化 TextField，然后在 render() 中使用它并在 validate() 中访问它，但没有成功。有什么想法可以实现吗？

Answer 1

刚看到这个，但好像没人回答。可以通过简单的事件捕获来完成:

validate = () =>{
  this.go = true;
}

_onError = () => {
  if (!this.go){
    return "";
  }
}