我有一個使用 Formik 構建的表單。表單中有兩個單選按鈕,單擊一個單選按鈕時會出現一個輸入欄位。我需要使用 Yup 驗證來驗證該輸入欄位。該值應小于 9999.99,它也可以接受整數和十進制值。我試過的代碼如下:
表單.js
<RadioGroup
name="callBackSelectionType"
initialValues={[
{
value: CALLBACKREQUIRED,
label: "Lower callback limit",
},
{
value: REMOVECALLBACK,
label: "Reset to default $10,000",
},
]}
/>
{values["callBackSelectionType"] === CALLBACKREQUIRED && (
<div className="fields-container">
<InputField
label={CALLBACK_LIMIT}
name="greaterThan"
placeholder="$0.00 to $9,999.99"
errorMessage={getRequiredMessage(CALLBACK_LIMIT)}
/>
</div>
)}
架構.js
const schema = yup.object().shape({
callBackSelectionType: yup.string().required(),
greaterThan: yup.string().when("callBackSelectionType", (val, schema) => {
if (val === "CALLBACKREQUIRED") {
return yup
.number()
.label(Labels.CALLBACKLIMIT)
.lessThan(9999.99, "Limit should be less than 9999.99")
.required(Messages.REQUIRED_FIELD);
}
else return yup.string().notRequired();
}),
});
此驗證適用于它是必填欄位,但不適用于它應該接受十進制并且應該小于 9999.99 的條件。請幫忙 。
先感謝您
uj5u.com熱心網友回復:
你可以嘗試使用.max(9999.99, "Commission should not be more than 2 digits")嗎?
轉載請註明出處,本文鏈接:https://www.uj5u.com/caozuo/396979.html
下一篇:React組件不斷重新渲染
