# General Translation Changelog: gt-react 10.16.0: Локализованные строки относительного времени
URL: https://generaltranslation.com/ru/blog/gt-react_v10_16_0.mdx
Docs index: https://generaltranslation.com/llms.txt
Description: 
Authors: Ernest McCarter
Published: 2026-04-01

## Обзор

Новый переменный компонент [`<RelativeTime>`](/docs/react/reference/components/relative-time) для отображения локализованных строк относительного времени, таких как «2 часа назад» или «через 3 дня». Внутри использует [`Intl.RelativeTimeFormat`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat).

| Программный пакет    | Версия  |
| -------------------- | ------- |
| `gt-react`           | 10.16.0 |
| `gt-next`            | 6.15.0  |
| `generaltranslation` | 8.2.0   |

## Использование

### Автоматический выбор единицы времени на основе `Date`

Передайте `Date`, и компонент автоматически выберет наиболее подходящую единицу времени:

```jsx
import { RelativeTime } from "gt-react";

<RelativeTime>{post.createdAt}</RelativeTime>
// "2 часа назад", "через 3 дня" и т.д.
```


### Явное значение и единица времени

Укажите точное значение и единицу времени по аналогии с API `Intl.RelativeTimeFormat`:

```jsx
import { RelativeTime } from "gt-react";

<RelativeTime value={3} unit="day" />
// "через 3 дня"
```


### Внутри переводимых строк

Оберните [`<RelativeTime>`](/docs/react/reference/components/relative-time) в [`<T>`](/docs/react/reference/components/t), чтобы включить его в переводимые предложения:

```jsx
import { T, RelativeTime } from "gt-react";

<T id="commentPosted">
  Posted <RelativeTime>{comment.createdAt}</RelativeTime>
</T>
```

## Безопасность гидратации

[`<RelativeTime>`](/docs/react/reference/components/relative-time) вычисляет относительное время локально, из-за чего в приложениях с серверным рендерингом возможны несовпадения при гидратации. Чтобы этого избежать, зафиксируйте `baseDate`:

```jsx
const now = new Date();

<RelativeTime baseDate={now}>{post.createdAt}</RelativeTime>
```

## Основные утилиты

В `generaltranslation` также доступны две новые функции форматирования:

* `formatRelativeTimeFromDate(date, options)` — автономная функция
* `GT.formatRelativeTimeFromDate(date, options)` — метод класса

## Ссылки

* [Справка по API `<RelativeTime>`](/docs/react/reference/components/relative-time)
* [Использование переменных компонентов](/docs/react/guides/formatting-variables)
* [PR #1153](https://github.com/generaltranslation/gt/pull/1153)

## Sitemap

See the full [sitemap](https://generaltranslation.com/sitemap.md) for all pages.