Autor:
    Aymeric PINEAU
    Data utworzenia:2026-09-19Ostatnia aktualizacja:2026-09-19

    Dokumentacja hooka useLocale

    Hook useLocale z remix-intlayer zapewnia dostęp do języka aktualnie przetwarzanego żądania HTTP, a także do domyślnego języka i listy dostępnych języków skonfigurowanych w projekcie.

    Użycie

    W komponencie Remix (na przykład przełączniku języków):

    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>
  );
};

    W procedurze obsługi trasy:

    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,
  });
});

    Wartości zwracane

    Hook zwraca obiekt typu UseLocaleResult:

    WłaściwośćTypOpis
    localeDeclaredLocalesJęzyk ustalony dla bieżącego żądania.
    defaultLocaleDeclaredLocalesDomyślny język rezerwowy skonfigurowany w intlayer.config.ts.
    availableLocalesDeclaredLocales[]Tablica wszystkich dostępnych języków skonfigurowanych w intlayer.config.ts.

    Opis

    1. Ustalanie w zakresie żądania: W aktywnym żądaniu obsługiwanym przez middleware intlayer(), useLocale odczytuje ustalony język z magazynu żądania.
    2. Bezpieczny powrót (Fallback): W przypadku wywołania poza kontekstem żądania (np. podczas skryptów inicjalizacyjnych lub zestawów testowych), domyślnie przyjmowany jest skonfigurowany defaultLocale.

    Powiązana dokumentacja

    useIntlayervite-intlayer