# General Translation Changelog: gt-react 10.16.0: expresión de tiempo relativo localizada
URL: https://generaltranslation.com/es/blog/gt-react_v10_16_0.mdx
Docs index: https://generaltranslation.com/llms.txt
Description: 
Authors: Ernest McCarter
Published: 2026-04-01

## Descripción general

Nuevo componente de variable [`<RelativeTime>`](/docs/react/reference/components/relative-time) para renderizar expresiones de tiempo relativo localizadas como &quot;hace 2 horas&quot; o &quot;en 3 días&quot;. Usa [`Intl.RelativeTimeFormat`](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Intl/RelativeTimeFormat) internamente.

| Paquete de software  | Versión |
| -------------------- | ------- |
| `gt-react`           | 10.16.0 |
| `gt-next`            | 6.15.0  |
| `generaltranslation` | 8.2.0   |

## Uso

### Seleccionar automáticamente la unidad a partir de una Date

Pasa una `Date` y el componente elige automáticamente la unidad más adecuada:

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

<RelativeTime>{post.createdAt}</RelativeTime>
// "hace 2 horas", "en 3 días", etc.
```


### Valor y unidad explícitos

Especifica un valor exacto y una unidad, siguiendo la API de `Intl.RelativeTimeFormat`:

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

<RelativeTime value={3} unit="day" />
// "en 3 días"
```


### Dentro de las cadenas traducidas

Envuelve [`<RelativeTime>`](/docs/react/reference/components/relative-time) en [`<T>`](/docs/react/reference/components/t) para incluirlo en frases traduccidas:

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

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

## Seguridad en la hidratación

[`<RelativeTime>`](/docs/react/reference/components/relative-time) calcula el tiempo relativo localmente, lo que puede provocar desajustes durante la hidratación en aplicaciones renderizadas en el servidor. Fija `baseDate` para evitarlo:

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

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

## Utilidades principales

También están disponibles en `generaltranslation` dos nuevas funciones de formato:

* `formatRelativeTimeFromDate(date, options)` — función autónoma
* `GT.formatRelativeTimeFromDate(date, options)` — método de clase

## Enlaces

* [`<RelativeTime>` referencia de la API](/docs/react/reference/components/relative-time)
* [Uso de los componentes de variable](/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.