|Labs
Rezervovat demoPlatforma
React (Lingo Compiler)
Alpha
React (MCP)React (i18n)
Legacy CLI (v0)
Zastaralé

Přehled

  • @lingo.dev/react

Začínáme

  • Rychlý start

Reference

  • LingoProvider
  • useLingo
  • Množná čísla a select
  • Formátování

Formátování

Každá instance Lingo nabízí sadu formátovacích metod navázaných na aktivní jazyk. Jde o lehké obálky nad nativním API Intl.* — bez navýšení velikosti bundlu a bez vnucených výchozích voleb, kromě řetězce jazyka, který jste už předali do LingoProvider.

Všechny metody jsou čisté: pro stejný vstup a jazyk vrátí stejný výstup. Můžete je bezpečně volat i uvnitř renderu bez memoizace.

Čísla#

l.num(value, options?)#

Naformátuje číslo se seskupováním a desetinnými místy podle jazyka.

tsx
l.num(1234567);       // "1,234,567" (en) / "1.234.567" (de) / "1 234 567" (fr)
l.num(3.14159, { maximumFractionDigits: 2 }); // "3.14" (en) / "3,14" (de)

options se předává do Intl.NumberFormat.

l.currency(value, code, options?)#

tsx
l.currency(29.99, "USD");   // "$29.99" (en) / "29,99 $US" (fr)
l.currency(29.99, "EUR");   // "€29.99" (en) / "29,99 €" (de)

l.percent(value, options?)#

Předávejte desetinné číslo (0.156, ne 15.6).

tsx
l.percent(0.156);                           // "16%" (en) / "16 %" (fr)
l.percent(0.156, { maximumFractionDigits: 1 }); // "15.6%"

l.unit(value, unit, options?)#

unit je název jednotky rozpoznávaný rozhraním Intl (celsius, kilometer-per-hour, megabyte atd.).

tsx
l.unit(32, "celsius");        // "32°C" (en) / "32 °C" (de)
l.unit(120, "kilometer-per-hour"); // "120 km/h"

l.compact(value, options?)#

tsx
l.compact(1234567);    // "1.2M" (en) / "123万" (ja) / "1,2 Mio." (de)
l.compact(950);        // "950"

Datum a čas#

l.date(value, options?) / l.time / l.datetime#

Přijímá Date nebo milisekundy od epochy.

tsx
l.date(new Date());     // "3/16/2026" (en) / "16.03.2026" (de)
l.time(new Date());     // "3:45 PM" (en) / "15:45" (de)
l.datetime(new Date()); // "3/16/2026, 3:45 PM" (en)

l.date(now, { dateStyle: "long" });   // "March 16, 2026"
l.date(now, { weekday: "short", month: "short", day: "numeric" }); // "Mon, Mar 16"

l.relative(value, unit, options?)#

Posun se znaménkem — záporný pro minulost, kladný pro budoucnost.

tsx
l.relative(-3, "day");       // "3 days ago" (en) / "vor 3 Tagen" (de)
l.relative(2, "hour");       // "in 2 hours"
l.relative(0, "second", { numeric: "auto" }); // "now"

Seznamy#

l.list(items, options?)#

Spojování položek podle jazyka. Výchozí styl je long s typem conjunction ("a").

tsx
l.list(["apples", "oranges", "pears"]); // "apples, oranges, and pears" (en)
                                         // "apples, oranges y pears" (es)
l.list(["red", "blue"], { type: "disjunction" }); // "red or blue"

Velikosti souborů#

l.fileSize(bytes)#

Praktická obálka, která vybere vhodnou jednotku (B, KB, MB, GB, TB, PB) a výsledek naformátuje s desetinnými místy podle jazyka.

tsx
l.fileSize(1024);          // "1 KB"
l.fileSize(1073741824);    // "1 GB" (en) / "1 Go" (fr)
l.fileSize(1536);          // "1.5 KB"

Zobrazované názvy#

l.displayName(code, type)#

Převede kód jazyka, regionu, písma nebo měny na lokalizovaný název.

tsx
l.displayName("en", "language");  // "English" (en) / "Englisch" (de) / "Английский" (ru)
l.displayName("US", "region");    // "United States" / "Vereinigte Staaten"
l.displayName("USD", "currency"); // "US Dollar" / "US-Dollar"
l.displayName("Cyrl", "script");  // "Cyrillic" / "Kyrillisch"

Vrátí undefined, pokud kód pro požadovaný typ nerozpozná.

Řazení#

l.sort(items, options?)#

Vrací nové seřazené pole — původní vstup nemění.

tsx
l.sort(["ä", "z", "a"]);   // de: ["a", "ä", "z"]   sv: ["a", "z", "ä"]
l.sort(["File 10", "File 2"], { numeric: true }); // ["File 2", "File 10"]

Segmentace#

l.segment(text, granularity?)#

Dělení na grafémy, slova nebo věty podle jazyka. Zásadní pro CJK jazyky, kde mezery neoddělují slova.

tsx
l.segment("Hello world", "word");  // ["Hello", " ", "world"]
l.segment("こんにちは世界", "word"); // ["こんにちは", "世界"]   (ja)
l.segment("café", "grapheme");     // ["c", "a", "f", "é"]

Výchozí granularita je "grapheme".

Proč lehké obálky?#

Každá metoda deleguje na nativní formátovač Intl — bez parsování, bez knihoven pro práci s čísly a bez dalších závislostí. Runtime drží bundle malý a nechává platformu pracovat s jazykovými daty, takže nové jazyky přidané do tabulek ICU ve V8 / SpiderMonkey fungují automaticky.

Jediná přidaná hodnota oproti samotnému Intl je řetězec jazyka — nastavíte ho jednou přes <LingoProvider locale="..."> a každý formátovač si ho odtud přečte. Pokud dáváte přednost přímému Intl (pro kód mimo React), createLingo(locale) vám dá stejný objekt bez provideru.

Kam dál#

  • useLingo — překlad řetězců přes l.text a l.rich.
  • Plurals and select — volba tvarů podle počtu nebo kategorie.

Byla tato stránka užitečná?

Max PrilutskiyMax Prilutskiy·Aktualizováno přibližně před 1 měsícem·3 min čtení