El useT hook

A veces necesitas traducir algo que no sea contenido HTML simple. Para ello, Magic Translate ofrece el useT hook. Puedes usarlo, por ejemplo, para traducir props.

import { useT } from '@magic-translate/react';

const MyComponent = () => {
  const t = useT();

  return (
    <button aria-label={t('Main menu')}>
      <HamburgerIcon />
    </button>
  );
};

Puedes usar la función t() en cualquier parte de tu componente. También puedes usarlo en tu marcado en lugar del componente <T>, si lo prefieres.

const MyComponent = () => {
  const t = useT();

  return <p>{t('This will be translated')}</p>;
};

Opciones

Puedes pasarle las mismas opciones a t() que al componente <T>, por ejemplo formality.

const MyComponent = () => {
  const t = useT();

  return <button>{t('Please click here', { formality: 'formal' })}</button>;
};