1. Documentation
    2. Packages
    3. intlayer
    4. getLocalizedUrl

    Documentation: getLocalizedUrl Fonction dans intlayer

    Description:

    La fonction getLocalizedUrl génère une URL localisée en préfixant l'URL donnée avec la locale spécifiée. Elle gère à la fois les URL absolues et relatives, en s'assurant que le préfixe de locale correct est appliqué en fonction de la configuration.

    Paramètres:

    • url: string

      • Description: La chaîne d'URL originale à préfixer avec une locale.
      • Type: string

    • currentLocale: Locales

      • Description: La locale actuelle pour laquelle l'URL est localisée.
      • Type: Locales

    • locales: Locales[]

      • Description: Tableau optionnel de locales prises en charge. Par défaut, les locales configurées dans le projet sont fournies.
      • Type: Locales[]
      • Default: Configuration du Projet

    • defaultLocale: Locales

      • Description: La locale par défaut pour l'application. Par défaut, la locale par défaut configurée dans le projet est fournie.
      • Type: Locales
      • Default: Configuration du Projet

    • prefixDefault: boolean

      • Description: Indique si l'URL doit être préfixée pour la locale par défaut. Par défaut, la valeur configurée dans le projet est fournie.
      • Type: boolean
      • Default: Configuration du Projet

    Retourne:

    • Type: string
    • Description: L'URL localisée pour la locale spécifiée.

    Exemple d'Utilisation:

    URL Relatives:

    typescript
    1import { getLocalizedUrl, Locales } from "intlayer"; 2 3getLocalizedUrl( 4 "/about", 5 Locales.FRENCH, 6 [Locales.ENGLISH, Locales.FRENCH], 7 Locales.ENGLISH, 8 false 9); 10 11// Résultat: "/fr/about" pour la locale française 12// Résultat: "/about" pour la locale par défaut (anglais)

    URL Absolues:

    typescript
    1getLocalizedUrl( 2 "https://example.com/about", 3 Locales.FRENCH, // Locale Actuelle 4 [Locales.ENGLISH, Locales.FRENCH], // Locales Supportées 5 Locales.ENGLISH, // Locale Par Défaut 6 false // Préfixer Locale Par Défaut 7); // Résultat: "https://example.com/fr/about" pour la française 8 9getLocalizedUrl( 10 "https://example.com/about", 11 Locales.ENGLISH, // Locale Actuelle 12 [Locales.ENGLISH, Locales.FRENCH], // Locales Supportées 13 Locales.ENGLISH, // Locale Par Défaut 14 false // Préfixer Locale Par Défaut 15); // Résultat: "https://example.com/about" pour l'anglais 16 17getLocalizedUrl( 18 "https://example.com/about", 19 Locales.ENGLISH, // Locale Actuelle 20 [Locales.ENGLISH, Locales.FRENCH], // Locales Supportées 21 Locales.ENGLISH, // Locale Par Défaut 22 true // Préfixer Locale Par Défaut 23); // Résultat: "https://example.com/en/about" pour l'anglais

    Locale Non Supportée:

    typescript
    1getLocalizedUrl( 2 "/about", 3 Locales.ITALIAN, // Locale Actuelle 4 [Locales.ENGLISH, Locales.FRENCH], // Locales Supportées 5 Locales.ENGLISH // Locale Par Défaut 6); // Résultat: "/about" (pas de préfixe appliqué pour la locale non supportée)

    Cas Limites:

    • Aucun Segment de Locale:

      • Si l'URL ne contient aucun segment de locale, la fonction préfixe en toute sécurité la locale appropriée.

    • Locale Par Défaut:

      • Lorsque prefixDefault est false, la fonction ne préfixe pas l'URL pour la locale par défaut.

    • Locales Non Supportées:

      • Pour les locales non listées dans locales, la fonction n'applique aucun préfixe.

    Utilisation dans les Applications:

    Dans une application multilingue, configurer les paramètres d'internationalisation avec locales et defaultLocale est essentiel pour garantir que la langue correcte est affichée. Voici un exemple de la façon dont getLocalizedUrl peut être utilisé dans une configuration d'application:

    tsx
    1import { Locales, type IntlayerConfig } from "intlayer"; 2 3// Configuration des locales supportées et de la locale par défaut 4export default { 5 internationalization: { 6 locales: [Locales.ENGLISH, Locales.FRENCH, Locales.SPANISH], 7 defaultLocale: Locales.ENGLISH, 8 }, 9} satisfies IntlayerConfig; 10 11export default config;

    La configuration ci-dessus garantit que l'application reconnaît ENGLISH, FRENCH et SPANISH comme langues supportées et utilise ENGLISH comme langue de secours.

    En utilisant cette configuration, la fonction getLocalizedUrl peut générer dynamiquement des URL localisées en fonction de la préférence linguistique de l'utilisateur:

    typescript
    1getLocalizedUrl("/about", Locales.FRENCH); // Résultat: "/fr/about" 2getLocalizedUrl("/about", Locales.SPANISH); // Résultat: "/es/about" 3getLocalizedUrl("/about", Locales.ENGLISH); // Résultat: "/about"

    En intégrant getLocalizedUrl, les développeurs peuvent maintenir des structures d'URL cohérentes à travers plusieurs langues, améliorant à la fois l'expérience utilisateur et le SEO.

    Si vous avez une idée d’amélioration pour améliorer cette documentation, n’hésitez pas à contribuer en submitant une pull request sur GitHub.

    Lien GitHub de la documentation
    getLocaleNamegetMultilingualUrls

    Dans cette page