O useT hook

Às vezes, você precisa traduzir algo diferente de conteúdo HTML simples. Para isso, Magic Translate oferece o useT hook. Você pode usá-lo, por exemplo, para traduzir props.

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

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

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

Você pode usar a função t() em qualquer lugar dentro do seu componente. Você também pode usá-lo em sua marcação em vez do componente <T>, se preferir.

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

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

Opções

Você pode passar as mesmas opções para t() e para o componente <T>, por exemplo formality.

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

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