How use client components with next18n?

Now I change languages like this Language.tsx

'use client'    

import Link from "next/link";
import React from "react";

export default function Language () {


return (
    <div className="flex flex-col gap-y-4">
      <Link href='/' locale='ru'>Русский</Link>
      <Link href='/' locale='en'>English</Link>
      <Link href='/' locale='zh'>中國人</Link>
    </div>
)
}

'use client'    

import Link from "next/link";
import React from "react";

export default function Language () {


return (
    <div className="flex flex-col gap-y-4">
      <Link href='/' locale='ru'>Русский</Link>
      <Link href='/' locale='en'>English</Link>
      <Link href='/' locale='zh'>中國人</Link>
    </div>
)
}

I have this languages Here should be text that rendered on a server page.tsx

import { useTranslation } from 'next-i18next';

function Home() {
  const { t } = useTranslation('translation');

  return (
    <main className="flex flex-col gap-y-4">
      <p>{t('text')}</p>
    </main>
  );
}

export default Home;

import { useTranslation } from 'next-i18next';

function Home() {
  const { t } = useTranslation('translation');

  return (
    <main className="flex flex-col gap-y-4">
      <p>{t('text')}</p>
    </main>
  );
}

export default Home;

How fix this error? (I want use server component)

0 Replies

No replies yetBe the first to reply to this messageJoin

Gaming

Programming

How use client components with next18n?