Next.js 快速入門

當您想要同時使用 Next 適配器和 React 執行時，請使用此軌道。

安裝

bash
npm install @18ways/next @18ways/react

基本翻譯

tsx
// app/layout.tsx
import type { ReactNode } from 'react';
import { init as initWays } from '@18ways/next/server';
 
const { WaysRoot } = initWays({
  apiKey: 'YOUR_18WAYS_PUBLIC_API_KEY',
  baseLocale: 'en-GB',
});
 
export default async function RootLayout({
  children,
}: {
  children: ReactNode;
}) {
  return (
    <html>
      <body>
        <WaysRoot>{children}</WaysRoot>
      </body>
    </html>
  );
}
 
// app/page.tsx
'use client';
 
import {
  LanguageSwitcher,
  Ways,
  T,
} from '@18ways/react';
import { useLocale } from '@18ways/next/client';
 
export default function Page() {
  const { locale, setLocale } = useLocale();
 
  return (
    <>
      <LanguageSwitcher
        currentLocale={locale}
        onLocaleChange={(nextLocale) =>
          setLocale(nextLocale)
        }
      />
      <Ways context="checkout.button">
        <T>Pay now</T>
      </Ways>
    </>
  );
}

如果您接下來需要路由、中介軟體或翻譯的元數據，請繼續查看使用說明。

下一步：Next.js 使用

Next.js Quickstart