# gt-next: General Translation Next.js SDK: useRegion
URL: https://generaltranslation.com/zh/docs/next/api/helpers/use-region.mdx
---
title: useRegion
description: useRegion Hook 的 API 参考
---

{/* 自动生成：请勿直接编辑。请改为编辑 content/docs-templates/ 中的模板。 */}


## 概述

`useRegion` Hook 会从 [`<GTProvider>` 上下文](/docs/next/api/components/gtprovider) 中获取用户当前选择的区域。

<Callout>
  `useRegion` 是一个客户端 Hook，*只能在客户端组件中使用*。
  请确保你的应用已包裹在 [`<GTProvider>`](/docs/next/api/components/gtprovider) 中。
</Callout>

## 参考

### 返回值

`string | undefined` — 当前生效的区域代码 (例如 `"US"`、`"CA"`) ；如果尚未设置区域，则为 `undefined`。

***

## 示例

### 基本用法

```jsx title="RegionDisplay.jsx" copy
'use client';
import { useRegion } from 'gt-next';

export default function RegionDisplay() {
  const region = useRegion(); // [!code highlight]
  return <p>Current region: {region ?? 'Not set'}</p>;
}
```

***


## 注意事项

* 如果用户尚未选择区域，则返回 `undefined`。
* 可以使用 [`<RegionSelector>`](/docs/next/api/components/region-selector) 组件或 [`useRegionSelector`](/docs/next/api/helpers/use-region-selector) Hook 来设置区域。

## 后续步骤

* 使用 [`<RegionSelector>`](/docs/next/api/components/region-selector) 让用户选择所在区域。
* 使用 [`useRegionSelector`](/docs/next/api/helpers/use-region-selector) 构建自定义区域选择器。