Unform
Clear input error on focus
Clear input error on focus
Unform exposes a function called clearError
within useField
hook, so use it
inside onFocus
.
components/Input.js
1import React, { useRef, useEffect } from 'react';2import { useField } from '@unform/core';34export default function Input({ name, label, ...rest }) {5 const inputRef = useRef(null);67 const { ..., clearError } = useField(name);89 useEffect(() => {10 // ... registerField11 }, []);1213 return (14 <>15 <input16 ref={inputRef}17 onFocus={clearError}18 {...rest}19 />2021 {error && <span className="error">{error}</span>}22 </>23 );24}