orderinfo.js

import React, { Component } from 'react';
import { Flex, NavBar, List, InputItem, Button, WhiteSpace, WingBlank } from 'antd-mobile';
import { createForm } from 'rc-form';

class orderinfo extends Component {
  render() {
    const { getFieldProps } = this.props.form;
    return (
      <Flex>
            <Flex.Item>
                <NavBar
                    style={{ "height": "44px" }}
                    className="order-tab"
                    mode="light"
                    icon={<i className="iconfont iconiconfront-68"></i>}
                >
                    报名信息
                </NavBar>
                <div>
                    <List>
                        <InputItem
                            {...getFieldProps('autofocus')}
                            clear
                            placeholder="请输入您的真实姓名"
                            ref={el => this.autoFocusInst = el}
                        >电话</InputItem>
                        <InputItem
                            {...getFieldProps('focus')}
                            clear
                            placeholder="请输入您的手机号码"
                            ref={el => this.inputRef = el}
                        >姓名</InputItem>
                        <InputItem
                            {...getFieldProps('focus')}
                            clear
                            placeholder="请输入您的QQ号码"
                            ref={el => this.inputRef = el}
                        >QQ</InputItem>
                    </List>
                    <WhiteSpace />
                    <div style={{marginTop: '21px'}}>
                        <WingBlank>
                            <Button type="primary">确认</Button>
                        </WingBlank>
                    </div>
                   
                </div>
            </Flex.Item>
      </Flex>
    )
  }
}

const Basicorderinfo = createForm()(orderinfo);

export default Basicorderinfo;