# react-native: msg
URL: https://generaltranslation.com/es/docs/react-native/api/strings/msg.mdx
---
title: msg
description: Referencia de la API de la función de cadena msg()
---

{/* GENERADO AUTOMÁTICAMENTE: No lo edites directamente. En su lugar, edita la plantilla en content/docs-templates/. */}


## Resumen

La función `msg` marca y codifica cadenas para traducirlas.

```jsx
const encodedString = msg('Hello, world!');
```

La cadena codificada debe pasarse al hook [`useMessages`](/docs/react-native/api/strings/use-messages) para obtener las traducciones.

<Callout>
  **Codificación:**
  `msg` codifica la cadena de entrada, por lo que no puedes usarla directamente en JSX ni en ningún otro contexto.
  Si quieres recuperar la cadena original, debes decodificarla con [`decodeMsg`](#decodemsg)
</Callout>


## Decodificación [#decodemsg]

Para recuperar la cadena original, debes decodificarla con [`decodeMsg`](#decodemsg)

```jsx
import { msg, decodeMsg } from 'gt-react-native';
const encodedString = msg('Hello, world!');
const decodedString = decodeMsg(encodedString);
console.log(decodedString); // "Hello, world!"
```


## Referencia

### Parámetros

| Nombre     | Tipo                                                                                  | Descripción                                                          |
| ---------- | ------------------------------------------------------------------------------------- | -------------------------------------------------------------------- |
| `content`  | `string`                                                                              | El contenido de cadena que se codificará.                             |
| `options?` | [`InlineTranslationOptions`](/docs/react-native/api/types/inline-translation-options) | Opciones de traducción para personalizar el comportamiento de `msg`. |

### Devuelve

Una cadena codificada en la que las variables interpoladas (si las hay) se sustituyen por sus valores.

***

## Funcionamiento

### Producción

Durante el proceso de CD, cualquier contenido dentro de una función `msg` se traducirá antes de que tu aplicación se despliegue.
Esto garantiza tiempos de carga rápidos para todas las configuraciones regionales, pero solo puede traducir contenido conocido en tiempo de construcción.

Una vez generadas, las traducciones se almacenan (1) en la CDN o (2) en la salida de compilación de tu aplicación, según tu configuración.
A partir de ahí, el contenido traducido se sirve a tus usuarios.
Si no se encuentra una traducción, se usará el contenido original.

Asegúrate de seguir la [guía de despliegue aquí](/docs/react-native/tutorials/quickdeploy).

### Desarrollo

Durante el desarrollo, la función `msg` traducirá el contenido bajo demanda.
Esto es útil para hacer prototipos de cómo se verá tu aplicación en distintos idiomas.
Recuerda añadir una clave de API de desarrollo a tu entorno para habilitar este comportamiento.

Verás cierta latencia durante la traducción bajo demanda en desarrollo.
Esto no ocurrirá en compilaciones de producción, a menos que el contenido se esté traduciendo explícitamente bajo demanda.

***

## Ejemplo

### Uso básico

Puedes usar `msg` para marcar cadenas para su traducción.

```jsx copy
import { msg, useMessages } from 'gt-react-native';

const encodedString = msg('Hello, world!');

export default function TranslateGreeting() {
  const m = useMessages();
  return (
    <p>
      {m(encodedString)}
    </p>
  );
}
```

Nota: &quot;Hello, world!&quot; se traducirá al idioma que prefiera el usuario.


### Uso de variables [#variables]

Puedes pasar variables a las traducciones del diccionario.

```jsx copy
import { msg, useMessages } from 'gt-react-native';

const encodedString = msg('Hello, {name}!', { name: 'Alice' });

export default function TranslateGreeting() {
  const m = useMessages();

  return (
    <p>
      {m(encodedString)}
    </p>
  );
}
```

Nota: &quot;Alice&quot; no se traducirá al idioma preferido del usuario, ya que es una variable.


### Uso del formato de mensajes ICU

`gt-react-native` admite el formato de mensajes ICU, que también te permite dar formato a las variables.

```jsx copy
import { msg, useMessages } from 'gt-react-native';

const encodedString = msg('There are {count, plural, =0 {no items} =1 {one item} other {{count} items}} in the cart', { count: 10 });

export default function TranslateGreeting() {
  const m = useMessages();
  return (
    <p>
      {m(encodedString)}
    </p>
  );
}
```

<Callout>
  El formato de mensajes ICU es una forma eficaz de dar formato a tus variables.
  Para más información, consulta la [documentación sobre el formato de mensajes ICU](https://unicode-org.github.io/icu/userguide/format_parse/messages/).
</Callout>

***


## Notas

* La función `msg` marca cadenas para su traducción.
* La traducción de cadenas con `msg` se realiza antes del runtime, durante el proceso de compilación (salvo en desarrollo).

## Próximos pasos

* Consulta [`useMessages`](/docs/react-native/api/strings/use-messages) para traducir cadenas.