form表单

form表单基本模板

import React, { PureComponent } from 'react'
import {  Form, Input } from 'antd'
import { FormComponentProps } from 'antd/lib/form'
interface IProps extends FormComponentProps {}
class Index extends PureComponent<IProps> {
  render() {
    const formItemLayout = {
      labelCol: {
        xs: { span: 24 },
        sm: { span: 6 },
      },
      wrapperCol: {
        xs: { span: 24 },
        sm: { span: 16 },
      },
    }
    const {
      form: { getFieldDecorator }
    } = this.props
    return (
      <Form {...formItemLayout}>
        <Form.Item label="登录账号">
          {getFieldDecorator('account', {
            rules: [
              {
                required: true,
                message: '请输入账号',
              }
            ],
          })(<Input placeholder="请输入账号" />)}
        </Form.Item>
      </Form>
    )
  }
}
const FormComponent = Form.create<IProps>()(Index)
export default FormComponent