Geschlechtsspezifische Inhalte / Geschlecht in Intlayer

Wie Geschlecht funktioniert

In Intlayer wird geschlechtsspezifischer Inhalt durch die Funktion gender realisiert, die bestimmte Geschlechtswerte ('male', 'female') ihren entsprechenden Inhalten zuordnet. Dieser Ansatz ermöglicht es Ihnen, Inhalte dynamisch basierend auf einem gegebenen Geschlecht auszuwählen. In Kombination mit React Intlayer oder Next Intlayer wird der passende Inhalt automatisch entsprechend dem zur Laufzeit angegebenen Geschlecht ausgewählt.

Einrichtung geschlechtsspezifischer Inhalte

Um geschlechtsspezifische Inhalte in Ihrem Intlayer-Projekt einzurichten, erstellen Sie ein Inhaltsmodul, das Ihre geschlechtsspezifischen Definitionen enthält. Nachfolgend finden Sie Beispiele in verschiedenen Formaten.

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

const myGenderContent = {
  key: "my_key",
  content: {
    myGender: gender({
      male: "mein Inhalt für männliche Nutzer",
      female: "mein Inhalt für weibliche Nutzer",
      fallback: "mein Inhalt, wenn das Geschlecht nicht angegeben ist", // Optional
    }),
  },
} satisfies Dictionary;

export default myGenderContent;

Wenn kein Fallback angegeben ist, wird der zuletzt deklarierte Schlüssel als Fallback verwendet, falls das Geschlecht nicht angegeben ist oder keinem definierten Geschlecht entspricht.

Verwendung von geschlechtsspezifischen Inhalten mit React Intlayer

Um geschlechtsspezifische Inhalte innerhalb einer React-Komponente zu nutzen, importieren Sie den useIntlayer Hook aus dem react-intlayer Paket. Dieser Hook ruft die Inhalte für den angegebenen Schlüssel ab und ermöglicht es, ein Geschlecht zu übergeben, um die passende Ausgabe auszuwählen.

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

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

  return (
    <div>
      <p>
        {
          /* Ausgabe: mein Inhalt für männliche Nutzer */
          myGender("male")
        }
      </p>
      <p>
        {
          /* Ausgabe: mein Inhalt für weibliche Nutzer */
          myGender("female")
        }
      </p>
      <p>
        {
          /* Ausgabe: mein Inhalt für männliche Nutzer */
          myGender("m")
        }
      </p>
      <p>
        {
          /* Ausgabe: mein Inhalt für weibliche Nutzer */
          myGender("f")
        }
      </p>
      <p>
        {
          /* Ausgabe: mein Inhalt, wenn kein Geschlecht angegeben ist */
          myGender("")
        }
      </p>
      <p>
        {
          /* Ausgabe: mein Inhalt, wenn kein Geschlecht angegeben ist */
          myGender(undefined)
        }
      </p>
    </div>
  );
};

export default GenderComponent;

Zusätzliche Ressourcen

Für detailliertere Informationen zur Konfiguration und Nutzung verweisen wir auf die folgenden Ressourcen:

• Intlayer CLI Dokumentation
• React Intlayer Dokumentation
• Next Intlayer Dokumentation

Diese Ressourcen bieten weitere Einblicke in die Einrichtung und Nutzung von Intlayer in verschiedenen Umgebungen und Frameworks.