Uso de Vanilla JS

O motor central fornece o comportamento em tempo de execução. A sua aplicação decide como apresentá-lo.

Contexto por área

Defina um contexto padrão no motor, depois sobreponha-o para chamadas específicas quando necessário.

const engine = create18waysEngine({
  apiKey: 'pk_dummy_demo_token',
  baseLocale: 'en-GB',
  locale: 'fr-FR',
  context: 'app',
});
 
const payNow = await engine.t('Pay now', {
  context: 'checkout.button',
});

As variáveis funcionam da mesma forma

const line = await engine.t('Hello {name}', {
  vars: { name: 'Ada' },
});

A mesma sintaxe waysParser utilizada no React funciona aqui também.

Comportamento do cache

O motor mantém uma loja de traduções na memória.

Isso significa:

• o primeiro pedido para uma nova string ou localidade pode atingir a API
• as solicitações posteriores podem ser atendidas a partir da loja
• voltar a uma localidade anterior é barato se as traduções já estiverem em cache

Traga os seus próprios controlos de localidade

Em Vanilla JS, a mudança de localidade é explícita.

async function setLocale(locale) {
  engine.setLocale(locale);
  await render();
}

Isso é uma opção melhor do que fingir que o pacote principal é responsável pelo roteamento ou pelo estado do React.

Quando ficar no pacote principal

Fique aqui se quiser o máximo controle.

Mova-se para os pacotes React ou Next quando quiser:

• Primitivas de tradução JSX
• ganchos de localidade integrados
• roteamento e metadados geridos pelo adaptador