Sofiane Boumedine Lexique Dev

HOC (Higher-Order Component)

React 🟡 Mid

Type : React Patterns

Definition

Fonction qui prend un composant et retourne un nouveau composant enrichi.

Analogie

Comme un decorateur qui emballe un cadeau avec des fonctionnalites supplementaires. Pattern classique, souvent remplace par les hooks.

Exemple de code

function withAuth(Component) {
  return function Wrapped(props) {
    const user = useAuth();
    if (!user) return <Redirect to=class="str">"/login" />;
    return <Component {...props} user={user} />;
  };
}