Cách sử dụng Vanilla JS

Công cụ lõi mang lại cho bạn hành vi khi chạy. Ứng dụng của bạn quyết định cách trình bày nó.

Ngữ cảnh theo từng khu vực

Đặt một ngữ cảnh mặc định trên engine, rồi ghi đè nó cho các lệnh gọi cụ thể khi cần.

ts
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',
});

Các biến hoạt động theo cùng một cách

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

Cú pháp waysParser giống nhau được dùng trong React cũng hoạt động ở đây.

Hành vi bộ nhớ đệm

Bộ máy lưu trữ bản dịch trong bộ nhớ.

Điều đó có nghĩa là:

  • lần yêu cầu đầu tiên cho một chuỗi hoặc ngôn ngữ mới có thể chạm vào API
  • các yêu cầu sau này có thể được phục vụ từ kho lưu trữ
  • chuyển về một ngôn ngữ trước đó là tốn ít chi phí nếu các bản dịch đã được lưu trong bộ nhớ đệm

Mang theo các điều khiển ngôn ngữ và khu vực của riêng bạn

Trong Vanilla JS, việc chuyển đổi ngôn ngữ là rõ ràng, tường minh.

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

Đó là một lựa chọn phù hợp hơn so với việc giả vờ rằng gói lõi sở hữu việc định tuyến hoặc trạng thái React.

Khi nào nên ở lại trong gói cốt lõi

Ở lại đây nếu bạn muốn kiểm soát tối đa.

Chuyển lên các gói React hoặc Next khi bạn muốn:

  • Các nguyên tắc cơ bản của JSX translation
  • các hook ngôn ngữ tích hợp
  • định tuyến và siêu dữ liệu do bộ chuyển đổi quản lý
Vanilla JS Usage