ant-design-pro Login 組件 實現 rules 驗證

1.引入組件

// 引入 ant-design-pro
import Login from 'ant-design-pro/lib/Login';
/**
 * UserName 賬號
 * Password 密碼
 * Submit   提交
 */
const { UserName, Password, Submit } = Login;

2.調用(驗證)

<UserName
  name="userId"
  placeholder="請輸入用戶名"
  rules={[{required: true, message: '用戶名不能為空!'}]}
/>
<Password
  name="pass"
  placeholder="請輸入密碼"
  rules = {[{required: true, message: '密碼不能為空!'}]}
/>

3.效果圖