React-Form表单数据获取

1、  const { getFieldProps } = this.props.form;

2、  <Input {…getFieldProps(‘userName’)} />//类似给input一个stringName

3、  this.props.form.getFieldsValue();//获取所有stringName的值

4、  this.props.form.getFieldValue(‘userName’);//获取单个控件的值

const FormItem = Form.Item;
  	
  	let Demo = React.createClass(		{	
  			handleSubmit(e){
  				e.preventDefault();
  				console.log('data of form:',this.props.form.getFieldsValue());
  				alert(this.props.form.getFieldValue('userName')+"-"+this.props.form.getFieldValue('passWord')+"-"+this.props.form.getFieldValue('agreement'));
  			},
	   		render()  {
  				const { getFieldProps } = this.props.form;
	  			return (
	  					<Form inline onSubmit={this.handleSubmit}>
	  						<FormItem label="Account">
	  							{
	  									<Input placeholder="please input the account" {...getFieldProps('userName')}/>
	  							}
	  						</FormItem>
	  						<FormItem label="Password">
	  							{
	  									<Input type="password" placeholder="Please input the pasword" {...getFieldProps('passWord')}/>
	  							}
	  						</FormItem>
	  						<FormItem>
	  							<Checkbox {...getFieldProps('agreement')}>Remember me</Checkbox>
	  						</FormItem>
	  						<Button type="primary" htmlType="submit">Submit</Button>
	  					</Form>
	  			);
	  		}
  		}
  		);
  	Demo = Form.create()(Demo);
   	this.ready = function(){
   		return Demo;
  	};

效果如下图：

提示内容如下图：

浏览器控制台输出如下图：