react-hook-form Controller onBlur 回調未觸發驗證

Question

想要在用戶 onBlurs 時修剪輸入字段。

    <Controller 
    ...
    onBlur={([e]) => {
    const { value } = e.target;
    const trimmedValue = value.trim();
    console.log('trim here: ', value, value.length, trimmedValue.length);
    if (trimmedValue === '') {
    console.log('error!!!');
    return trimmedValue;
    }
    return trimmedValue;
    }} />

規則：

rules={{
 pattern: {
 value: new RegExp(firstName.validationString, 'i'),
message: 'First name must be 2 - 100 characters with no numbers.',
},
required: firstName.mandatory && 'Must fill in first name',
}}

function 被觸發並到達 if 語句。 但是即使我根據需要設置了規則，也不會觸發錯誤。

Answer 1

在您的寄存器中使用它或 controller

validate: (value) => { return !!value.trim()}

看看這里： https://github.com/react-hook-form/react-hook-form/issues/1650