IT技术 - 输入无效数据时使用 react-bootstrap-typeahead 清除 inputText - 吾爱随笔录

我正在尝试使用 react-bootstrap-typeahead 验证选择，并在移动到页面的另一个区域时清除输入文本（如果无效）。

我想不出一个好的方法来做到这一点。

Typeahead 组件的 onBlur 没有在正确的时间触发以进行验证和清除。

任何建议，将不胜感激

这是我的预先定义

        <Typeahead  bsSize="sm"
                    defaultSelected = {this.props.options.slice(selectedIndex)}
                    clearButton
                    labelKey="roomNumber"
                    options={this.props.options}
                    placeholder={this.props.placeholder}                          
                    name={this.props.nameId}
                    ref={ref => this.roomChoice = ref}
                    onChange={this.onChangeHandler.bind(this)}
                    onInputChange={this.onInputChangeHandler.bind(this)}
                    onBlur={this.onBlurHandler.bind(this)} 
                    onFocus={this.onFocusHandler.bind(this)} 
                  />

这是我的 onBlur 函数：

onBlurHandler(event)
{   
         if (this.roomInputText)
        {
            if (!this.roomSelectedOption)
            {
                this.roomChoice.getInstance().clear()
            }
        }

}

如果有人输入文本，onBlur 不会在正确的时间触发我选择选项。

<div> <Typeahead options={[...]} ref={(ref) => this._typeahead = ref} onInputChange={this.onInputChangeSelection} /> </div> onInputChangePartsSelection = (value) => { if (value) { const instance = this._typeahead.getInstance() instance.clear() instance.focus() } }