fix: should get meta from children

components/form/FormItem.jsx

@@ -1,6 +1,5 @@
 import React from 'react';
 import classNames from 'classnames';
-import objectAssign from 'object-assign';
 
 function prefixClsFn(prefixCls, ...args) {
   return args.map((s) => {
@@ -33,6 +32,10 @@ class FormItem extends React.Component {
     return this.props.children.props && this.props.children.props.id;
   }
 
+  getMeta() {
+    return this.props.children.props && this.props.children.props.__meta;
+  }
+
   renderHelp() {
     const props = this.props;
     const prefixCls = props.prefixCls;
@@ -94,11 +97,8 @@ class FormItem extends React.Component {
 
   isRequired() {
     if (this.context.form) {
-      const meta = this.props.fieldOption || {};
-
-      // Have to merge manually, for children have no `__meta` now.
+      const meta = this.getMeta() || {};
       const validate = (meta.validate || []);
-      validate.push({ rules: meta.rules });
 
       return validate.filter((item) => !!item.rules).some((item) => {
         return item.rules.some((rule) => rule.required);
@@ -122,23 +122,13 @@ class FormItem extends React.Component {
   }
 
   renderChildren() {
-    const context = this.context;
     const props = this.props;
     const children = React.Children.map(props.children, (child) => {
-      // If <Component />&nbsp;&nbsp;&nbsp;<Component />,
-      // React will not convert &nbsp;&nbsp;&nbsp; into component.
-      if (!child.type) {
-        return child;
+      if (typeof child.type === 'function' && !child.props.size) {
+        return React.cloneElement(child, { size: 'large' });
       }
 
-      const childProps = {};
-      if (typeof child.type === 'function' && !child.props.size) {
-        objectAssign(childProps, { size: 'large' });
-      }
-      if (context.form && this.getId()) {
-        objectAssign(childProps, context.form.getFieldProps(this.getId(), props.fieldOption));
-      }
-      return React.cloneElement(child, childProps);
+      return child;
     });
     return [
       this.renderLabel(),

components/form/demo/validate-basic.md

@@ -77,7 +77,7 @@ class BasicDemo extends React.Component {
   }
 
   render() {
-    const { getFieldProps } = this.props.form;
+    const { getFieldProps, getFieldError, isFieldValidating } = this.props.form;
 
     return (
       <Form horizontal form={this.props.form}>
@@ -85,14 +85,15 @@ class BasicDemo extends React.Component {
           label="用户名："
           labelCol={{ span: 7 }}
           wrapperCol={{ span: 12 }}
-          hasFeedback>
+          hasFeedback
+          help={isFieldValidating('name') ? '校验中...' : (getFieldError('name') || []).join(', ')}>
           <Input placeholder="实时校验，输入 JasonWood 看看"
             {...getFieldProps('name', {
               rules: [
                 { required: true, min: 5, message: '用户名至少为 5 个字符' },
                 { validator: this.userExists },
               ],
-            })}/>
+            })} />
         </FormItem>
 
         <FormItem

components/form/demo/validate-customized.md

@@ -9,7 +9,7 @@
 ---
 
 ````jsx
-import { Button, Form, Input, Row, Col } from 'antd';
+import { Button, Form, Input, Row, Col, Modal } from 'antd';
 import classNames from 'classnames';
 const createForm = Form.create;
 const FormItem = Form.Item;
@@ -24,12 +24,12 @@ let Demo = React.createClass({
       passBarShow: false, // 是否显示密码强度提示条
       rePassBarShow: false,
       passStrength: 'L', // 密码强度
-      rePassStrength: 'L'
+      rePassStrength: 'L',
+      visible: false,
     };
   },
 
-  handleSubmit(e) {
-    e.preventDefault();
+  handleSubmit() {
     this.props.form.validateFields((errors, values) => {
       if (!!errors) {
         console.log('Errors in form!!!');
@@ -37,14 +37,10 @@ let Demo = React.createClass({
       }
       console.log('Submit!!!');
       console.log(values);
+      this.setState({ visible: false });
     });
   },
 
-  handleReset(e) {
-    e.preventDefault();
-    this.props.form.resetFields();
-  },
-
   getPassStrenth(value, type) {
     if (value) {
       let strength;
@@ -70,6 +66,14 @@ let Demo = React.createClass({
     }
   },
 
+  showModal() {
+    this.setState({ visible: true });
+  },
+
+  hideModal() {
+    this.setState({ visible: false });
+  },
+
   checkPass(rule, value, callback) {
     const form = this.props.form;
     this.getPassStrenth(value, 'pass');
@@ -123,6 +127,9 @@ let Demo = React.createClass({
   render() {
     const { getFieldProps } = this.props.form;
     return (
+      <div>
+        <Button type="primary" onClick={this.showModal}>修改密码</Button>
+        <Modal title="修改密码" visible={this.state.visible} onOk={this.handleSubmit} onCancel={this.hideModal}>
           <Form horizontal form={this.props.form}>
             <Row>
               <Col span="18">
@@ -170,19 +177,9 @@ let Demo = React.createClass({
                 {this.state.rePassBarShow ? this.renderPassStrengthBar('rePass') : null}
               </Col>
             </Row>
-
-        <Row>
-          <Col span="18">
-            <FormItem
-              wrapperCol={{ span: 12, offset: 6 }}>
-              <Button type="primary" onClick={this.handleSubmit}>确定</Button>
-              &nbsp;&nbsp;&nbsp;
-              <Button type="ghost" onClick={this.handleReset}>重置</Button>
-            </FormItem>
-          </Col>
-          <Col span="6" />
-        </Row>
           </Form>
+        </Modal>
+      </div>
     );
   }
 });

components/form/index.md

@@ -105,8 +105,6 @@ CustomizedForm = Form.create({})(CustomizedForm);
 |  hasFeedback | 配合 validateStatus 属性使用，是否展示校验状态图标 | bool |  | false  |
 |  prefixCls | 样式类名，默认为 ant-form，通常您不需要设置 | string |  |  'ant-form' |
 
-`Form.Item` 内的菜单控件必须设置 `id: String`，且必须唯一。
-
 ### Input
 
 | 参数      | 说明                                     | 类型       |  可选值 |默认值 |