<Plural>

Überblick

Wir verwenden die <Plural> Komponente, um Sätze zu konjugieren. Denken Sie an den Unterschied zwischen den Sätzen: "Du hast einen Artikel." und "Du hast zwei Artikel."

Im Englischen müssen Sie zwei verschiedene Sätze basierend auf der Anzahl der Artikel definieren. In anderen Sprachen müssen Sie bis zu sechs definieren.

const count = 1;
<Plural n={count}
  singular={You have one item.}
  plural={You have some items.}
/>

Referenz

Requisiten

Prop	Type	Default
`n?`	`number`	-
`children??`	`any`	`undefined`
`locales??`	`string[]`	`undefined`
`[key]: string?`	`string \| JSX.Element`	-

Die [key]: string Syntax zeigt beliebige Schlüssel an, die potenzielle Pluralisierungszweige darstellen. Zum Beispiel können Zweige wie singular und plural als Parameter hinzugefügt werden.

Beschreibung

Prop-Name	Beschreibung
`n`	Die Zahl, die verwendet wird, um die Pluralform zu bestimmen. Dies ist für die Pluralisierung erforderlich.
`children`	Fallback-Inhalt, der gerendert wird, wenn kein passender Pluralzweig gefunden wird.
`locales`	Optionale Gebietsschemas, um das Formatierungsgebietsschema anzugeben. Wenn nicht angegeben, wird das Standardgebietsschema des Benutzers verwendet. Lesen Sie mehr über die Angabe von Gebietsschemas hier.
`[key]: string`	Zweige, die Pluralformen darstellen. Die genauen Zweige hängen vom Gebietsschema ab.

Rückgaben

JSX.Element, das den Inhalt enthält, der der Pluralform von n entspricht, oder den Fallback-Inhalt.

Ausnahmen

Error, wenn n nicht bereitgestellt wird oder keine gültige Zahl ist.

Welche Formen sollte ich hinzufügen?

Sie müssen nur die Pluralformen in Ihrer Sprache verwenden.

Die möglichen Formen sind: "singular", "plural", "dual", "zero", "one", "two", "few", "many", "other".

Wenn Sie ein Entwickler sind, der "en-US" verwendet, verwenden Sie nur zwei: "singular" und "plural".
Wenn Sie ein Entwickler in "zh-CN" sind, verwenden Sie nur "other".

Lesen Sie mehr über die verschiedenen Formen hier.

Beispiele

Grundlegende Verwendung

Verwenden Sie die <Plural> Komponente, um Pluralformen zu handhaben.

BasicExample.jsx

import { Plural } from 'gt-next';
 
export default function ItemCount({ count }) {
  return (
    <Plural n={count} 
      singular={Sie haben einen Artikel.}
      plural={Sie haben einige Artikel.}
    />
  );
}

Fallbacks

Sie können einen Fallback bereitstellen, falls der an n übergebene Wert keine passenden Zweige hat.

FallbackExample.jsx

import { Plural } from 'gt-next';
 
export default function ItemCount({ count }) {
  return (
    <Plural n={count}
      singular={Sie haben einen Artikel.}
    >
      Sie haben einige Artikel. // [!code highlight]
    </Plural>
  );
}

Plurale übersetzen

Alles, was Sie tun müssen, um zu übersetzen, ist die <T> Komponente hinzuzufügen.

PluralExample.jsx

import { T, Plural } from 'gt-next';
 
export default function ItemCount({ count }) {
  return (
  <T id="itemCount">
    <Plural n={count}
      singular={Sie haben einen Artikel.} 
      plural={Sie haben einige Artikel.} 
    />
  );
}

Variablen hinzufügen

Was ist, wenn wir einige Variablen zum pluralisierten Satz hinzufügen möchten?

PluralExample.jsx

import { T, Plural, Num } from 'gt-next';
 
export default function ItemCount({ count }) {
  return (
    <Plural n={count}
      singular={Sie haben <Num>{count}</Num> Artikel.} 
      plural={Sie haben <Num>{count}</Num> Artikel.} 
    />
  );
}

Wenn Sie sich innerhalb einer <T> Komponente befinden, umschließen Sie alle dynamischen Inhalte mit einem <Currency>, <DateTime>, <Num>, oder <Var>.

<T id="itemCount">
  <Plural n={count}
    singular={Sie haben <Num>{count}</Num> Artikel.} 
    plural={Sie haben <Num>{count}</Num> Artikel.} 
  />
</T>

Notizen

Die <Plural> Komponente wird verwendet, um Pluralformen zu handhaben.
Die verfügbaren Pluralzweige (z.B. one, other, few, many) hängen von der Sprache ab und folgen den Unicode CLDR Pluralisierungsregeln.

Nächste Schritte

Für weitere Beispiele, schauen Sie sich das Referenzdokument zu verzweigenden Komponenten hier an.
Für eine fortgeschrittene Nutzung kombinieren Sie <Plural> mit variablen Komponenten wie <Currency>, <DateTime>, <Num>, und <Var>. Lesen Sie mehr über variable Komponenten hier.

Für einen tieferen Einblick in Pluralisierung und Verzweigung besuchen Sie Verwendung von verzweigenden Komponenten.

<Plural>

Auf dieser Seite