usePreferredLanguages

usePreferredLanguages 是一个返回用户首选语言的字符串数组的 hook。它使用 navigator.languages。

usePreferredLanguages 响应式地跟踪 navigator.languages，返回按用户偏好排序的 BCP 47 语言标签数组（例如 ["en-US", "en", "fr"]）。该 hook 监听 languagechange 事件，当用户修改浏览器或系统语言设置时自动更新。

使用场景

• 基于用户的语言偏好选择最佳可用语言环境用于国际化/本地化
• 显示与语言相关的内容、日期格式或数字格式
• 构建语言选择器 UI，高亮显示用户的首选语言

注意事项

• SSR 安全：接受一个 defaultLanguages 参数，在服务端渲染期间返回该值。服务端不会访问 navigator。
• 响应式：当用户通过 languagechange 事件更改浏览器语言偏好时自动更新。
• 顺序重要：返回的数组按偏好排序。第一个元素是用户最偏好的语言。

Usage

function Demo() {
  const preferredLanguages = usePreferredLanguages();
  return <div>首选语言: {JSON.stringify(preferredLanguages)}</div>;
}

API

UsePreferredLanguages

Returns

string[]: 语言偏好

Arguments