useNavigatorLanguage

Demo

Supported: true

Navigator Language:

en-US

使用方法

TypeScript

import { defineComponent, ref, watch } from 'vue'
import { useNavigatorLanguage } from '@vueuse/core'

export default defineComponent({
  setup() {
    const { language } = useNavigatorLanguage()

    watch(language, () => {
      // 监听值的变化
    })

    return {
      language,
    }
  },
})

import { defineComponent, watch } from 'vue'
import { useNavigatorLanguage } from '@vueuse/core'
export default defineComponent({
  setup() {
    const { language } = useNavigatorLanguage()
    watch(language, () => {
      // 监听值的变化
    })
    return {
      language,
    }
  },
})

类型声明

typescript

export interface NavigatorLanguageState {
  isSupported: Ref<boolean>
  /**
   * ISO 639-1 标准语言代码
   *
   * @info 检测到的用户代理语言偏好作为语言标签
   * （有时称为“区域设置标识符”）。
   * 这由一个表示语言的2-3个字母的基本语言标签组成，
   * 可选地后跟由“-”分隔的其他子标签。
   * 最常见的额外信息是国家或地区变体（如 'en-US' 或 'fr-CA'）。
   *
   * @see https://www.iso.org/iso-639-language-codes.html
   * @see https://www.loc.gov/standards/iso639-2/php/code_list.php
   *
   */
  language: Ref<string | undefined>
}
/**
 *
 * Reactive useNavigatorLanguage
 *
 * Detects the currently selected user language and returns a reactive language
 * @see https://vueuse.org/useNavigatorLanguage
 *
 */
export declare function useNavigatorLanguage(
  options?: ConfigurableWindow,
): Readonly<NavigatorLanguageState>
export type UseNavigatorLanguageReturn = ReturnType<typeof useNavigatorLanguage>