Контент на основе пола / Пол в Intlayer

Как работает пол

В Intlayer контент на основе пола реализуется с помощью функции gender, которая сопоставляет конкретные значения пола ('male', 'female') с соответствующим содержимым. Такой подход позволяет динамически выбирать контент в зависимости от указанного пола. При интеграции с React Intlayer или Next Intlayer соответствующий контент автоматически выбирается в соответствии с полом, переданным во время выполнения.

Настройка контента на основе пола

Чтобы настроить контент на основе пола в вашем проекте Intlayer, создайте модуль контента, который включает определения, специфичные для пола. Ниже приведены примеры в различных форматах.

import { gender, type Dictionary } from "intlayer";

const myGenderContent = {
  key: "my_key",
  content: {
    myGender: gender({
      male: "мой контент для мужчин",
      female: "мой контент для женщин",
      fallback: "мой контент, когда пол не указан", // Необязательно
    }),
  },
} satisfies Dictionary;

export default myGenderContent;

Если не указан fallback, в качестве fallback будет взят последний объявленный ключ, если пол не указан или не соответствует ни одному из определённых полов.

Использование контента на основе пола с React Intlayer

Чтобы использовать контент, зависящий от пола, внутри React-компонента, импортируйте и используйте хук useIntlayer из пакета react-intlayer. Этот хук получает контент по указанному ключу и позволяет передать пол для выбора соответствующего варианта вывода.

import type { FC } from "react";
import { useIntlayer } from "react-intlayer";

const GenderComponent: FC = () => {
  const { myGender } = useIntlayer("my_key");

  return (
    <div>
      <p>
        {
          /* Вывод: мой контент для мужчин */
          myGender("male")
        }
      </p>
      <p>
        {
          /* Вывод: мой контент для женщин */
          myGender("female")
        }
      </p>
      <p>
        {
          /* Вывод: мой контент для мужчин */
          myGender("m")
        }
      </p>
      <p>
        {
          /* Вывод: мой контент для женщин */
          myGender("f")
        }
      </p>
      <p>
        {
          /* Вывод: мой контент, когда пол не указан */
          myGender("")
        }
      </p>
      <p>
        {
          /* Вывод: мой контент, когда пол не указан */
          myGender(undefined)
        }
      </p>
    </div>
  );
};

export default GenderComponent;

Дополнительные ресурсы

Для получения более подробной информации о настройке и использовании обратитесь к следующим ресурсам:

• Документация Intlayer CLI
• Документация React Intlayer
• Документация Next Intlayer

Эти ресурсы предлагают дополнительные сведения о настройке и использовании Intlayer в различных средах и фреймворках.