106k
New

方向

PreviousNext

一个用于设置应用文本方向的提供者组件。

Radix UIBase UI
Radix UI

DirectionProvider 组件用于设置应用的文本方向（ltr 或 rtl）。这对于支持阿拉伯语、希伯来语和波斯语等从右向左书写的语言至关重要。

下面是组件在 RTL 模式下的预览。使用语言选择器切换语言。想查看更多示例，请查看组件页面中的 RTL 部分。

تسجيل الدخول إلى حسابك
أدخل بريدك الإلكتروني أدناه لتسجيل الدخول إلى حسابك
نسيت كلمة المرور؟

安装

pnpm dlx shadcn@latest add direction

使用方法

import { DirectionProvider } from "@/components/ui/direction"
<html dir="rtl">
  <body>
    <DirectionProvider direction="rtl">
      {/* 你的应用内容 */}
    </DirectionProvider>
  </body>
</html>

useDirection

useDirection 钩子用于获取应用当前的文本方向。

import { useDirection } from "@/components/ui/direction"
 
function MyComponent() {
  const direction = useDirection()
  return <div>当前方向: {direction}</div>
}