Autore:
    Aymeric PINEAU
    Creazione:2026-09-19Ultimo aggiornamento:2026-09-19

    Documentazione dell'hook useLocale

    L'hook useLocale di remix-intlayer fornisce l'accesso alla locale della richiesta HTTP attualmente in fase di elaborazione, insieme alla locale predefinita e alle locale disponibili configurate nel progetto.

    Utilizzo

    In un componente Remix (ad esempio un selettore di lingua):

    src/components/LocaleSwitcher.tsx
    import { type FC } from "react";
import { Link } from "@remix-run/react";
import { useLocale } from "remix-intlayer";
import { getLocalizedUrl, getPathWithoutLocale } from "intlayer";

export const LocaleSwitcher: FC = () => {
  const { locale, availableLocales } = useLocale();
  const pathWithoutLocale = getPathWithoutLocale();

  return (
    <nav>
      <ul>
        {availableLocales.map((localeItem) => (
          <li key={localeItem} className="p-1">
            <Link
              href={getLocalizedUrl(pathWithoutLocale, localeItem)}
              aria-current={localeItem === locale ? "page" : undefined}
            >
              {localeItem.toUpperCase()}
            </Link>
          </li>
        ))}
      </ul>
    </nav>
  );
};

    In un gestore di route:

    src/server.ts
    import { createRouter } from "remix/router";
import { intlayer, useLocale } from "remix-intlayer";

const router = createRouter({
  middleware: [intlayer()],
});

router.get("/api/locale-info", () => {
  const { locale, defaultLocale, availableLocales } = useLocale();

  return Response.json({
    locale,
    defaultLocale,
    availableLocales,
  });
});

    Valori restituiti

    L'hook restituisce un oggetto di tipo UseLocaleResult:

    ProprietàTipoDescrizione
    localeDeclaredLocalesLa locale risolta per la richiesta corrente.
    defaultLocaleDeclaredLocalesLa locale di fallback predefinita configurata in intlayer.config.ts.
    availableLocalesDeclaredLocales[]Array di tutte le locale disponibili configurate in intlayer.config.ts.

    Descrizione

    1. Risoluzione con ambito di richiesta: In una richiesta attiva gestita dal middleware intlayer(), useLocale legge la locale risolta dall'archiviazione della richiesta.
    2. Fallback pulito: Se chiamato al di fuori di un contesto di richiesta, ricade per impostazione predefinita sulla defaultLocale configurata.

    Documentazione correlata

    useIntlayervite-intlayer