我有一个带有最小/最大值验证器的输入。还有一个按钮可将此输入中的值设置为最大值。该按钮不属于这种形式。 我在 min 下输入输入值,然后出现错误消息。之后,我单击了一个设置最大值的按钮(并且该值在此最小/最大范围内),但错误消息并没有消失。我发现如果我不直接输入输入并通过侧面按钮更改它,验证器将无法工作。
<div className={`${styles.creditPointTable} d-flex`}>
<span
id={styles.payAllTotal}
onClick={() => {
paymentSum.setValue(+credit.earlyPayment);
}}
>
pay max{' '}
{formatCurrencyHelper(credit?.earlyPayment)}
</span>
</div>
<Form.Item
name="paymentSum"
valuePropName="option"
rules={[
{
validator: (_, e) => {
return paymentSum.value <=
maxPaymentValue &&
paymentSum.value >= minPaymentValue
? Promise.resolve()
: Promise.reject('');
},
message: (
<div className={styles.errorMessage}>
{paymentSum.value < minPaymentValue
? `Min value is ${minPaymentValue}₽`
: paymentSum.value > maxPaymentValue
? `Max value is ${maxPaymentValue}₽`
: 'Type the correct sum'}
</div>
),
},
]}
>
<Input
value={paymentSum.value}
className={styles.formControl}
id="credit-amountPayment"
maxLength={7}
onInput={handlePaymentSum}
type="number"
{...paymentSum.forInput}
/>
即使用户没有更改输入值,验证器也应该在输入值更改时触发。 我该怎么做?
找到了解决方案:我可以用
form.validateFields(['paymentSum']);
触发验证