Composants

BaseFormatProps

Props de baseFormat pour les composants proposés par Vue I18n

Signature:

export interface BaseFormatProps

Détails

Les définitions d'interface des props sous-jacentes des composants tels que Translation, DatetimeFormat et NumberFormat.

i18n

Signature:

i18n?: Composer;

Détails

Une instance de composeur avec une portée existante.

Cette option prend la priorité sur l'option scope.

locale

Signature:

locale?: Locale;

Détails

Spécifie la locale à utiliser pour le composant.

Si spécifié, la portée globale ou la locale de la portée parente du composant cible ne sera pas outrepassée et la locale spécifiée sera utilisée.

scope

Signature:

scope?: ComponentI18nScope;

Détails

Spécifie la portée à utiliser dans le composant cible.

Vous pouvez spécifier soit global soit parent.

Si global est spécifié, la portée globale est utilisée, sinon si parent est spécifié, la portée du parent du composant cible est utilisée.

Si le parent est une portée globale, la portée globale est utilisée, si c'est une portée locale, la portée locale est utilisée.

tag

Signature:

tag?: string | object;

Détails

Utilisé pour envelopper le contenu distribué dans l'emplacement (slot). S'il est omis, le contenu de l'emplacement est traité comme des fragments.

Vous pouvez spécifier un nom de balise basé sur une chaîne, tel que p, ou l'objet pour lequel le composant est défini.

DatetimeFormat

Composant de format de date et heure

Signature:

DatetimeFormat: {
    new (): {
        $props: VNodeProps & DatetimeFormatProps & BaseFormatProps;
    };
}

Détails

Voir les éléments suivants pour les détails sur les propriétés

DANGER

Non pris en charge par IE, en raison de l'absence de prise en charge de Intl.DateTimeFormat#formatToParts dans IE

Si vous voulez l'utiliser, vous devez utiliser un polyfill

Voir aussi

• FormattableProps
• BaseFormatProps
• Formatage personnalisé

DatetimeFormatProps

Props du composant DatetimeFormat

Signature:

export type DatetimeFormatProps = FormattableProps<number | Date, Intl.DateTimeFormatOptions>;

FormattableProps

Props formattables

Signature:

export interface FormattableProps<Value, Format> extends BaseFormatProps

Détails

Les props utilisées dans le composant DatetimeFormat ou NumberFormat

format

Signature:

format?: string | Format;

Détails

Le format à utiliser dans le composant cible.

Spécifiez la clé de format sous forme de chaîne ou le format tel que défini par l'API Intl dans ECMA 402.

value

Signature:

value: Value;

Détails

La valeur spécifiée pour le composant cible

NumberFormat

Composant de format numérique

Signature:

NumberFormat: {
    new (): {
        $props: VNodeProps & NumberFormatProps & BaseFormatProps;
    };
}

Détails

Voir les éléments suivants pour les détails sur les propriétés

DANGER

Non pris en charge par IE, en raison de l'absence de prise en charge de Intl.NumberFormat#formatToParts dans IE

Si vous voulez l'utiliser, vous devez utiliser un polyfill

Voir aussi

• FormattableProps
• BaseFormatProps
• Formatage personnalisé

NumberFormatProps

Props du composant NumberFormat

Signature:

export type NumberFormatProps = FormattableProps<number, Intl.NumberFormatOptions>;

Translation

Composant de traduction

Signature:

Translation: {
    new (): {
        $props: VNodeProps & TranslationProps;
    };
}

Détails

Voir les éléments suivants pour les détails sur les propriétés

Voir aussi

• TranslationProps
• BaseFormatProps
• Interpolation de composants

Exemples

<div id="app">
  <!-- ... -->
  <i18n keypath="term" tag="label" for="tos">
    <a :href="url" target="_blank">{{ $t('tos') }}</a>
  </i18n>
  <!-- ... -->
</div>

import { createApp } from 'vue'
import { createI18n } from 'vue-i18n'

const messages = {
  en: {
    tos: 'Termes de service',
    term: 'J\'accepte xxx {0}.'
  },
  ja: {
    tos: '利用規約',
    term: '私は xxx の{0}に同意します。'
  }
}

const i18n = createI18n({
  locale: 'en',
  messages
})

const app = createApp({
  data: {
    url: '/term'
  }
}).use(i18n).mount('#app')

TranslationProps

Props du composant Translation

Signature:

export interface TranslationProps extends BaseFormatProps

keypath

Signature:

keypath: string;

Détails

La clé du message de localisation peut être spécifiée dans la propriété

plural

Signature:

plural?: number | string;

Détails

La propriété de choix du nombre de message pluriel