第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時綁定郵箱和手機(jī)立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

如何正確使用 AntD FormInstance 函數(shù)?

如何正確使用 AntD FormInstance 函數(shù)?

陪伴而非守候 2023-03-10 14:40:08
我正在嘗試在用戶提交表單之前驗證用戶的輸入。如何將輸入字段值傳遞給我的 validateInput 函數(shù),如果它返回 false 觸發(fā)器并在字段中應(yīng)用以下屬性hasFeedback,validateStatus以及helpconst Demo = () => {  const [form] = form.useForm();  const onFinish = (values) => {    console.log("Success:", values);  };  const onFinishFailed = (errorInfo) => {    console.log("Failed:", errorInfo);  };  const validateInput = (input) => {    const isEmailFormatValid = `regex...`;    var check = input.match(validateFormat);    return check  };  return (    <Form      form={form}      name="basic"      initialValues={{        remember: true,      }}      onFinish={onFinish}      onFinishFailed={onFinishFailed}    >      <Form.Item        label="Email"        name="email"        / * hasFeedback         validateStatus="warning"        help="Invalid email format" */        rules={[          {            required: true,            message: "Please input your email!",          },        ]}      >        <Input />      </Form.Item>      <Form.Item        label="Password"        name="password"        rules={[          {            required: true,            message: "Please input your password!",          },        ]}      >        <Input.Password />      </Form.Item>      <Form.Item>        <Button block type="primary" htmlType="submit">          Submit        </Button>      </Form.Item>    </Form>  );};
查看完整描述

1 回答

?
largeQ

TA貢獻(xiàn)2039條經(jīng)驗 獲得超8個贊

<Form.Item>proprules是一個數(shù)組,因此您可以向其中添加許多規(guī)則。


如果你想檢查電子郵件輸入是否不為空,同時是一個有效的電子郵件,你可以這樣做:


<Form.Item

  label="Email"

  name="email"

  rules={[

    {

      required: true,

      message: "Please input your email!",

    },

    {

      pattern: /your email regex here/,

      message: "Invalid email format",

    },

  ]}

>

  <Input />

</Form.Item>

不需要額外的驗證功能。如果不符合指定的正則表達(dá)式,將自動顯示錯誤。


你可以在這里看到ant design input的所有規(guī)則


查看完整回答
反對 回復(fù) 2023-03-10
  • 1 回答
  • 0 關(guān)注
  • 254 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號