Merge pull request #347 from catchonme/master

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

src/components/Input.tsx

@@ -0,0 +1,63 @@
+import React from 'react';
+import {autobind} from '../utils/helper';
+
+export interface InputProps
+  extends React.InputHTMLAttributes<HTMLInputElement> {
+  forwardedRef: React.Ref<HTMLInputElement>;
+}
+
+export interface InputState {
+  value: any;
+}
+
+class InputInner extends React.Component<InputProps, InputState> {
+  isOnComposition: boolean = false;
+  state = {value: this.props.value};
+
+  componentWillReceiveProps(nextProps: InputProps) {
+    if (this.props.value !== nextProps.value) {
+      this.setState({
+        value: nextProps.value
+      });
+    }
+  }
+
+  @autobind
+  handleComposition(e: React.CompositionEvent<HTMLInputElement>) {
+    this.isOnComposition = e.type !== 'compositionend';
+    if (!this.isOnComposition) {
+      this.handleChange(e as any);
+    }
+  }
+
+  @autobind
+  handleChange(e: React.ChangeEvent<HTMLInputElement>) {
+    const {onChange} = this.props;
+    const value = e.currentTarget.value;
+
+    this.isOnComposition || (onChange && onChange(e));
+    this.setState({
+      value
+    });
+  }
+
+  render() {
+    const {forwardedRef, ...rest} = this.props;
+
+    return (
+      <input
+        {...rest}
+        value={this.state.value}
+        ref={forwardedRef}
+        onChange={this.handleChange}
+        onCompositionStart={this.handleComposition}
+        onCompositionUpdate={this.handleComposition}
+        onCompositionEnd={this.handleComposition}
+      />
+    );
+  }
+}
+
+export default React.forwardRef<HTMLInputElement>((props, ref) => {
+  return <InputInner {...props} forwardedRef={ref} />;
+}) as React.ReactType<React.InputHTMLAttributes<HTMLInputElement>>;

src/components/Select.tsx

@@ -22,6 +22,7 @@ import {highlight} from '../renderers/Form/Options';
 import {findDOMNode} from 'react-dom';
 import {ClassNamesFn, themeable} from '../theme';
 import Checkbox from './Checkbox';
+import Input from './Input';
 
 export interface Option {
   label?: string;
@@ -596,7 +597,7 @@ export class Select extends React.Component<SelectProps, SelectState> {
             })}
           >
             <Icon icon="search" className="icon" />
-            <input
+            <Input
               {...getInputProps({
                 onFocus: this.onFocus,
                 onBlur: this.onBlur,

src/renderers/Form/Combo.tsx

@@ -153,7 +153,7 @@ export default class ComboControl extends React.Component<ComboProps> {
       });
 
       if (store.activeKey >= values.length) {
-        store.setActiveKey(values.length - 1);
+        store.setActiveKey(Math.max(0, values.length - 1));
       }
     }
   }

src/renderers/Form/Item.tsx

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

src/renderers/Form/Select.tsx

@@ -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);

src/renderers/Form/Text.tsx

@@ -9,6 +9,7 @@ import debouce = require('lodash/debounce');
 import {filter} from '../../utils/tpl';
 import find = require('lodash/find');
 import {Icon} from '../../components/icons';
+import Input from '../../components/Input';
 import {autobind, createObject, setVariable} from '../../utils/helper';
 import {isEffectiveApi} from '../../utils/api';
 
@@ -495,7 +496,7 @@ export default class TextControl extends React.PureComponent<
                   )
                 )}
 
-                <input
+                <Input
                   {...getInputProps({
                     name,
                     ref: this.inputRef,