select中文输入未完成时不发送加载选项的请求

This commit is contained in:
catchonme 2019-11-14 15:44:32 +08:00
parent d93f311f6f
commit 3624c7b9a8
3 changed files with 23 additions and 3 deletions

View File

@ -197,6 +197,7 @@ interface SelectState {
inputValue: string;
highlightedIndex: number;
selection: Array<Option>;
composing: boolean;
}
export class Select extends React.Component<SelectProps, SelectState> {
@ -244,10 +245,13 @@ export class Select extends React.Component<SelectProps, SelectState> {
this.handleAddClick = this.handleAddClick.bind(this);
this.handleEditClick = this.handleEditClick.bind(this);
this.handleDeleteClick = this.handleDeleteClick.bind(this);
this.onCompositionStart = this.onCompositionStart.bind(this);
this.onCompositionEnd = this.onCompositionEnd.bind(this);
this.state = {
isOpen: false,
isFocused: false,
composing: false,
inputValue: '',
highlightedIndex: -1,
selection: value2array(props.value, props)
@ -349,6 +353,20 @@ export class Select extends React.Component<SelectProps, SelectState> {
this.props.onBlur && this.props.onBlur(e);
}
// 输入中文未完成时不发送加载选项的请求
onCompositionStart(e: any) {
this.setState({
composing: true
});
}
onCompositionEnd(e: any) {
this.setState({
composing: false
});
this.handleInputChange(e);
}
focus() {
this.input
? this.input.focus()
@ -406,7 +424,7 @@ export class Select extends React.Component<SelectProps, SelectState> {
{
inputValue: evt.currentTarget.value
},
() => loadOptions && loadOptions(this.state.inputValue)
() => !this.state.composing && loadOptions && loadOptions(this.state.inputValue)
);
}
@ -603,6 +621,8 @@ export class Select extends React.Component<SelectProps, SelectState> {
disabled: disabled,
placeholder: searchPromptText,
onChange: this.handleInputChange,
onCompositionStart: this.onCompositionStart,
onCompositionEnd: this.onCompositionEnd,
ref: this.inputRef
})}
/>

View File

@ -244,7 +244,7 @@ export class FormItemWrap extends React.Component<FormItemProps> {
// 强制不渲染 label 的话
if (renderLabel === false) {
label = false;
label = label === false ? false : '';
}
description = description || desc;

View File

@ -115,7 +115,7 @@ export default class SelectControl extends React.Component<SelectProps, any> {
throw new Error('fetcher is required');
}
if (this.cache[input] || ~input.indexOf("'") /*中文没输完 233*/) {
if (this.cache[input]) {
let options = this.cache[input] || [];
let combinedOptions = this.mergeOptions(options);
setOptions(combinedOptions);