Спросите свой вопрос и получите сводку документа, используя эту страницу и выбранного вами поставщика AI
Интеграция сервера MCP Intlayer в ваш любимый AI-ассистент позволяет получать все документы непосредственно из ChatGPT, DeepSeek, Cursor, VSCode и т.д.
Просмотр документации сервера MCPСодержимое этой страницы было переведено с помощью ИИ.
Смотреть последнюю версию оригинального контента на английскомЕсли у вас есть идея по улучшению этой документации, не стесняйтесь внести свой вклад, подав запрос на вытягивание на GitHub.
Ссылка на документацию GitHubКопировать Markdown документа в буфер обмена
Интеграция с Next.js: Документация по хуку useIntlayer
Хук useIntlayer разработан специально для приложений Next.js, чтобы эффективно получать и управлять локализованным контентом. В этой документации будет рассмотрено, как использовать этот хук в проектах Next.js, обеспечивая правильные практики локализации.
Импорт useIntlayer в Next.js
В зависимости от того, работаете ли вы с клиентскими или серверными компонентами в приложении Next.js, вы можете импортировать хук useIntlayer следующим образом:
Клиентский компонент:
typescriptКопировать кодКопировать код в буфер обмена
import { useIntlayer } from "next-intlayer"; // Используется в клиентских компонентах
Серверный компонент:
tsxКопировать кодКопировать код в буфер обмена
import { useIntlayer } from "next-intlayer/server"; // Используется в серверных компонентах
Параметры
- key: Строковый идентификатор ключа словаря, из которого вы хотите получить контент.
- locale (необязательно): Конкретная локаль для использования. Если не указана, хук использует локаль, установленную в клиентском или серверном контексте.
Файлы словарей
Крайне важно, чтобы все ключи контента были определены в файлах декларации контента, чтобы избежать ошибок во время выполнения и обеспечить типовую безопасность. Такой подход также облегчает интеграцию с TypeScript для проверки во время компиляции.
Инструкции по настройке файлов декларации контента доступны здесь.
Пример использования в Next.js
Ниже показано, как можно использовать хук useIntlayer на странице Next.js для динамической загрузки локализованного контента в зависимости от текущей локали приложения:
Копировать код в буфер обмена
import { ClientComponentExample } from "@components/ClientComponentExample";import { ServerComponentExample } from "@components/ServerComponentExample";import { type NextPageIntlayer, IntlayerClientProvider } from "next-intlayer";import { useIntlayer, IntlayerServerProvider } from "next-intlayer/server";const HomePage: NextPageIntlayer = async ({ params }) => { const { locale } = await params; const content = useIntlayer("homepage", locale); return ( <> <p>{content.introduction}</p> <IntlayerClientProvider locale={locale}> <ClientComponentExample /> </IntlayerClientProvider> <IntlayerServerProvider locale={locale}> <ServerComponentExample /> </IntlayerServerProvider> </> );};
Копировать код в буфер обмена
"use-client";import type { FC } from "react";import { useIntlayer } from "next-intlayer";const ClientComponentExample: FC = () => { const content = useIntlayer("component-content"); return ( <div> <h1>{content.title}</h1> <p>{content.description}</p> </div> );};
Копировать код в буфер обмена
import type { FC } from "react";import { useIntlayer } from "next-intlayer/server";const ServerComponentExample: FC = () => { const content = useIntlayer("component-content"); return ( <div> <h1>{content.title}</h1> <p>{content.description}</p> </div> );};
Обработка локализации атрибутов
Для локализации таких атрибутов, как alt, title, href, aria-label и других, убедитесь, что вы правильно ссылаетесь на содержимое:
Копировать код в буфер обмена
<img src={content.image.src.value} alt={content.image.alt.value} />
Дополнительная информация
- Визуальный редактор Intlayer: Узнайте, как использовать визуальный редактор для более удобного управления контентом здесь.
В этой документации описывается использование хука useIntlayer специально в средах Next.js, предоставляя надежное решение для управления локализацией в ваших приложениях Next.js.
История документации
- 5.5.10 - 2025-06-29: Инициализация истории