# gt-react: General Translation React SDK: useLocaleDirection
URL: https://generaltranslation.com/ja/docs/react/api/helpers/use-locale-direction.mdx
---
title: useLocaleDirection
description: useLocaleDirection フックの API リファレンス
---

{/* 自動生成: 直接編集しないでください。代わりに content/docs-templates/ のテンプレートを編集してください。 */}


## 概要

`useLocaleDirection` フックは、[`<GTProvider>` コンテキスト](/docs/react/api/components/gtprovider)から、現在のロケールまたは指定したロケールの文字方向 (`'ltr'` または `'rtl'`) を取得します。

<Callout>
  `useLocaleDirection` はクライアントサイドのフックであり、*クライアントサイドのコンポーネントでのみ使用できます*。
  アプリが [`<GTProvider>`](/docs/react/api/components/gtprovider) でラップされていることを確認してください。
</Callout>

## リファレンス

### パラメータ

| パラメータ    | 型               | 説明                                                                      |
| -------- | --------------- | ----------------------------------------------------------------------- |
| `locale` | `string` (省略可)  | BCP 47 のロケールコード (例: `'ar'`, `'en-US'`) 。省略した場合は、コンテキスト内の現在のロケールが使用されます。 |

### 戻り値

`'ltr' | 'rtl'` — ロケールの文字方向。

***

## 例

### 現在のロケールの文字方向を取得する

```jsx title="DirectionWrapper.jsx" copy
'use client';
import { useLocaleDirection } from 'gt-react';

export default function DirectionWrapper({ children }) {
  const dir = useLocaleDirection(); // [!code highlight]
  return <div dir={dir}>{children}</div>;
}
```


### 特定のロケールの文字方向を取得する

```jsx title="SpecificDirection.jsx" copy
'use client';
import { useLocaleDirection } from 'gt-react';

export default function SpecificDirection() {
  const dir = useLocaleDirection('ar'); // 'rtl' [!code highlight]
  return <p>Arabic text direction: {dir}</p>;
}
```

***


## 注意

* このフックは常に同期的に動作します。
* RTL対応で要素の`dir`属性を設定する際に便利です。

## 次のステップ