Das useT hook

Manchmal musst du etwas anderes als reinen HTML-Inhalt übersetzen. Dafür bietet Magic Translate den useT hook an. Du kannst es zum Beispiel verwenden, um props zu übersetzen.

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

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

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

Du kannst die Funktion t() überall in deiner Komponente verwenden. Du kannst es auch in deinem Markup anstelle der <T>-Komponente verwenden, wenn du das bevorzugst.

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

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

Optionen

Du kannst die gleichen Optionen an t() übergeben wie an die <T>-Komponente, zum Beispiel formality.

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

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