Passer au contenu principal
​
useUsernameValidation(username, options?)
useUsernameValidation(username, options?): UsernameValidationResult
Hook React pour valider un nom d’utilisateur selon la politique actuelle de noms d’utilisateur d’Auth0.Ce hook vérifie le nom d’utilisateur fourni par rapport à toutes les règles de validation configurées et retourne un résultat structuré indiquant s’il est valide ou non. Optionnellement, il peut envoyer les erreurs de validation au gestionnaire d’erreurs global pour que les composants d’interface utilisateur qui observent le champ username puissent automatiquement les afficher ou y réagir.

​
Paramètres

​
username
string
La chaîne de caractères représentant le nom d’utilisateur à valider.
​
options?
​
includeInErrors?
boolean
Lorsque true, les erreurs de validation sont stockées dans le gestionnaire d’erreurs global sous le champ username. La valeur par défaut est false.

​
Valeur renvoyée

UsernameValidationResultUn objet UsernameValidationResult avec :
  • isValid — true si le nom d’utilisateur satisfait toutes les règles configurées.
  • errors — un tableau d’erreurs de validation par règle avec code, message et isValid.

​
Écrans pris en charge

  • signup
  • signup-id
Example
import { useUsernameValidation } from "@auth0/auth0-acul-react/signup";

export function UsernameField() {
  const { isValid, errors } = useUsernameValidation(username, { includeInErrors: true });

  return (
    <div>
      <input
        value={username}
        onChange={e => setUsername(e.target.value)}
        aria-invalid={!isValid}
      />

      {!isValid && (
        <ul>
          {errors.map(err => (
            <li key={err.code}>{err.message}</li>
          ))}
        </ul>
      )}
    </div>
  );
}

​
Remarques

  • Lorsque includeInErrors est activé, le hook met automatiquement à jour les erreurs dans le store d’erreurs, qui peut être consommé par le hook useErrors.
  • Le hook n’est réévalué que lorsque username ou options.includeInErrors change.