在下一个 js 中更改语言环境（i18n 中的语言）时如何更改字体系列答案

【问题标题】：how to change font family when change locale (language in i18n) in next js在下一个 js 中更改语言环境（i18n 中的语言）时如何更改字体系列
【发布时间】：2022-06-17 00:07:45
【问题描述】：

我有一个多语言应用程序，它会通过选择输入切换语言，在 2 种语言之间切换区域设置，另一方面，我有 2 个字体系列，我想在区域设置更改时切换。

在 _app.js 中

const {locale} = useRouter();
useEffect(() => {
  if(locale === "ur"){
    import("../styles/urdoFont.css");
  }else{
    import("../styles/persianFont.css");
  }
}, [locale]);

在标题组件中

<Link 
   href={{
      pathname: '/',
                    }}
      as={`/`}
      locale="fa"
 >
   <a>
     <Image
        src="/image/iran.svg"
        alt=""
        width="40"
        height="40"
     />
   </a>
 </Link>
 <Link 
      href={{
         pathname: '/ur',
      }}
      as={`/ur`}
      locale="ur"
    >
      <a>
        <Image
          src="/image/pakistan.svg"
          alt=""
          width="40"
          height="40"
        />
      </a>
 </Link>

【问题讨论】：

你想改变什么字体系列？在单个组件中还是在全局中？
例如当点击“fr”时将url更改为example.com/fr并将所有网站的字体更改为frfont.wpff

标签： reactjs next.js