Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

es6 写法中Form的使用,getFieldProps undefined???? #2444

Closed
Yhaojing opened this issue Jul 21, 2016 · 4 comments
Closed

es6 写法中Form的使用,getFieldProps undefined???? #2444

Yhaojing opened this issue Jul 21, 2016 · 4 comments

Comments

@Yhaojing
Copy link

本地环境

node 6.2.1
npm 3.9.3

  • antd 版本:^1.6.3
  • 操作系统及其版本:ios
  • 浏览器及其版本:

你做了什么?

使用and的Form表单
`import React, { Component, PropTypes } from 'react';
import { Input, Button, Form } from 'antd';
const FormItem = Form.Item;

class Login extends Component {
constructor(props) {
super(props);
this.handleSubmit = this.handleSubmit.bind(this);
}
handleSubmit(e) {
e.preventDefault();
this.props.onLoginClick(this.props.form.getFieldsValue());
}
render() {
const { errorMessage, form } = this.props;
console.log('form:', form);
const { getFieldProps } = form;
return (


<FormItem
label="用户名:"
labelCol={{ span: 6 }}
wrapperCol={{ span: 14 }}
>
<Input
ref="username" placeholder="Username"
{...getFieldProps('username')}
/>

<FormItem
label="密码:"
labelCol={{ span: 6 }}
wrapperCol={{ span: 14 }}
>
<Input
type="password" ref="password" placeholder="Password"
{...getFieldProps('password')}
/>

<FormItem wrapperCol={{ span: 14, offset: 6 }} style={{ marginTop: 24 }}>
Login

{errorMessage &&
<p style={{ color: 'red' }}>{errorMessage}


}

);
}
}

Login.propTypes = {
form: PropTypes.func,
onLoginClick: PropTypes.func.isRequired,
errorMessage: PropTypes.string,
};

export default Login;
`

你期待的结果是:

不能正常使用

实际上的结果:

TypeError: Cannot read property 'getFieldProps' of undefined

可重现的在线演示

@afc163
Copy link
Member

afc163 commented Jul 21, 2016

按文档来,你漏代码了。

Form.createForm

@afc163 afc163 closed this as completed Jul 21, 2016
@Yhaojing
Copy link
Author

Yhaojing commented Jul 21, 2016

我知道有这句代码,以前写成let Demo = React.createClass({})形式时是Demo = Form.create()(Demo);
但是现在 class Demo extends Component {} Demo是类了,那句代码应该怎么写

@shenke119
Copy link

constructor(props) {
        super(props);
        this.state = {

        };
        this.getFieldProps = props.form.getFieldProps;
        this.getFieldError = props.form.getFieldError;
        this.isFieldValidating = props.form.isFieldValidating;
        this.validateFields = props.form.validateFields;
        this.getFieldValue = props.form.getFieldValue;
 }

下面的this.props.form.getFieldsValue() 之类 改成this.getFieldsValue()

@lock
Copy link

lock bot commented May 4, 2018

This thread has been automatically locked because it has not had recent activity. Please open a new issue for related bugs and link to relevant comments in this thread.

@lock lock bot locked as resolved and limited conversation to collaborators May 4, 2018
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Labels
None yet
Projects
None yet
Development

No branches or pull requests

3 participants