# General Translation React SDKs (gt-react, gt-next, gt-react-native): useLocales
URL: https://generaltranslation.com/zh/docs/react/reference/hooks/use-locales.mdx
Docs index: https://generaltranslation.com/llms.txt
Description: 列出受支持的区域设置。useLocales 的 API 参考。

`useLocales` 钩子会从 [`<GTProvider>`](/docs/react/reference/components/gt-provider) 上下文读取你的应用支持的区域设置代码，并以字符串数组的形式返回。可用它来渲染或遍历可用的区域设置，例如在构建自定义语言切换器时。

*可在 `gt-react`、`gt-next`、`gt-tanstack-start` 和 `gt-react-native` 中使用。*

## 概览 [#overview]

调用 `useLocales` 以获取支持的区域设置代码。

*示例从 `gt-react` 导入；请改为从您所用框架的包中导入。*

```tsx
import { useLocales } from 'gt-react';

export default function LocaleList() {
  const locales = useLocales(); // [!code highlight]
  return (
    <ul>
      {locales.map((locale) => (
        <li key={locale}>{locale}</li>
      ))}
    </ul>
  );
}
```

*注意：在 `gt-react` 中，请在 [`<GTProvider>`](/docs/react/reference/components/gt-provider) 内调用 `useLocales`。在 `gt-next` 中，它也可在服务器组件中使用。*

## 工作方式 [#how-it-works]

该列表来自你配置的 [`locales`](/docs/react/reference/config#locales)。每一项都是一个 BCP 47 区域设置代码。

## 返回值 [#returns]

**类型** `readonly string[]`

由受支持的区域设置代码组成的数组，例如 `['en-US', 'fr', 'ja']`。

## 注意事项 [#notes]

* `useLocales` 是同步的，在服务端组件和客户端组件中均可使用。
* 如需读取当前生效的区域设置，请使用 [`useLocale`](/docs/react/reference/hooks/use-locale)。

## Sitemap

See the full [sitemap](https://generaltranslation.com/sitemap.md) for all pages.