usePhone.js

import { Form } from 'antd';
import React from 'react';
import LoginForm from '../components/Login';
import LoginMessage from './loginMessage';
const { Mobile, Captcha, Submit } = LoginForm;

const usePhone = props => {
  const [form] = Form.useForm();
  return (
    <LoginForm form={form} onSubmit={props.onSubmit}>
      {props.status === 'error' &&
        props.type === 'account' &&
        !props.submitting && <LoginMessage content="手机号码未注册" />}
      <Mobile name="mobile" placeholder="请输入手机号码" />
      <Captcha
        name="captcha"
        placeholder="请输入短信验证码"
        countDown={60}
        getCaptchaButtonText=""
        getCaptchaSecondText="秒"
        autoComplete="off"
        rules={[
          {
            required: true,
            message: '请输入短信验证码！',
          },
        ]}
      />
      <Submit loading={props.submitting} style={{ marginTop: '0px' }}>
        登录
      </Submit>
    </LoginForm>
  );
};
export default usePhone;