fix: form validateStatus icon not work #321

vueComponent · Dec 19, 2018 · d55d1f5 · d55d1f5
1 parent 3393f0e
commit d55d1f5
Showing 1 changed file with 27 additions and 1 deletion.
diff --git a/components/form/FormItem.jsx b/components/form/FormItem.jsx
@@ -10,6 +10,8 @@ import { initDefaultProps, getComponentFromProp, filterEmpty, getSlotOptions, is
 import getTransitionProps from '../_util/getTransitionProps'
 import BaseMixin from '../_util/BaseMixin'
 import { cloneElement, cloneVNodes } from '../_util/vnode'
+import Icon from '../icon'
+
 export const FormItemProps = {
   id: PropTypes.string,
   prefixCls: PropTypes.string,
@@ -204,9 +206,33 @@ export default {
           'is-validating': validateStatus === 'validating',
         })
       }
+      let iconType = ''
+      switch (validateStatus) {
+        case 'success':
+          iconType = 'check-circle'
+          break
+        case 'warning':
+          iconType = 'exclamation-circle'
+          break
+        case 'error':
+          iconType = 'close-circle'
+          break
+        case 'validating':
+          iconType = 'loading'
+          break
+        default:
+          iconType = ''
+          break
+      }
+      const icon = (props.hasFeedback && iconType)
+        ? <span class={`${props.prefixCls}-item-children-icon`}>
+          <Icon type={iconType} theme={iconType === 'loading' ? 'outlined' : 'filled'} />
+        </span> : null
       return (
         <div class={classes}>
-          <span class={`${props.prefixCls}-item-children`}>{c1}</span>
+          <span class={`${props.prefixCls}-item-children`}>
+            {c1}{icon}
+          </span>
           {c2}{c3}
         </div>
       )