从右到左支持

概述

虽然大多数语言是从左到右（LTR）书写的，但有些语言是从右到左（RTL）书写的。这些语言包括阿拉伯语、希伯来语、波斯语和乌尔都语，全球总共有超过五亿人使用这些语言。

请查看英文和阿拉伯文的 General Translation 主页，以展示 ltr 和 rtl 渲染之间的区别。

指南

要为您的应用程序添加 RTL 支持，我们只需要确定语言的方向并相应地设置屏幕上文本的方向。

您可以使用 useLocaleDirection() 钩子来确定语言是 "rtl" 还是 "ltr"。

使用 useLocale() 函数在根布局中获取语言环境，然后将 lang 和 dir 属性添加到 <html> 标签：

my-app/app/layout.tsx

import { useLocale, useLocaleDirection, GTProvider } from 'gt-next'

export default function RootLayout({ children }) {
        
  const locale = useLocale(); // 例如阿拉伯语的 "ar"
  const dir = useLocaleDirection(); // 例如"从右到左"的 "rtl"

  return (
    <html lang={locale} dir={dir}>
      <body> 
        <GTProvider>
          {children}
        </GTProvider>
      </body>
    </html>
  )
}

从右到左支持

概述

指南

在本页面