Country Select 国家选择

基于 虚拟化选择器 USelectV2 的国家/地区选择组件。选项数据来自 i18n-iso-countries(ISO 3166-1 alpha-2)。组件在加载选项逻辑时会 自动 registerLocale 注册包内全部语言 JSON,因此 getNames 能返回完整本地化国名;展示语言由 UConfigProviderlocale.name(如 zh-cnzh)或 namesLocale 决定。绑定值为 alpha-2 大写(如 CNUS),v-modelchange 会做统一大写规范化。默认 country-name-variant="short",界面为常用简称(如英文 China、United States);需要联合国式全称时设为 full下拉与选中项默认不展示 alpha-2 后缀;若需附带 (MY) 等形式,请设置 show-alpha2-in-label

单选

当前值:CN

多选

当前值:CN, US, JP

国名:简称与全称

通过 country-name-variant 配置下拉与输入框里展示 简称 还是 正式全称(默认 简称):

取值说明
short默认。常用简称,对应 i18n-iso-countriesalias(如英文 ChinaUnited States)。
full正式全称,对应 official(如 People's Republic of ChinaUnited States of America)。
vue
<!-- 默认 short,可省略 -->
<u-country-select v-model="code" />

<u-country-select v-model="code" country-name-variant="full" />

国际化说明

  • 占位符:默认使用全局语言包中的 uniboot.select.placeholder(与 Select 一致),也可通过 placeholder 覆盖。
  • 国家/地区展示名:由 i18n-iso-countriesgetNames 提供,随 UConfigProviderlocale.name(如 zh-cnen)自动映射到包内支持的语言码(如 zhen)。也可通过 namesLocale 强制指定展示用语言,而不跟随全局 locale。默认使用 country-name-variant="short"(库内 alias),如英文下为「China」「United States」;设为 full 时使用正式全称(official,如「People's Republic of China」)。
  • 绑定值:始终为 ISO 3166-1 alpha-2 大写(如 DE),不因界面语言切换而改变。

国际化示例

UConfigProvider 切换中英文语言包后,同一 v-model(下例固定为 DE)对应的输入框与下拉文案会显示为「德国」或「Germany」等。为便于观察,示例将候选项限制为少数几个国家;语言切换按钮单独一行,下方为国家选择器。

绑定值为 ISO alpha-2:DE。切换语言后,输入框与下拉中的国名会变为对应语言(例如 DE 在中文为「德国」、英文为「Germany」),无需改 v-model

API

属性

除下列说明外,其余常用能力(如 sizeclearablefilterableloadingcollapse-tagspopper-class 等)与 Virtualized Select 虚拟化选择器USelectV2 的同名属性一致,并透传给底层组件。

名称说明类型默认值
model-value / v-model单选为 string,多选为 string[];均为 ISO 3166-1 alpha-2string / array
multiple是否多选booleanfalse
include仅展示这些 alpha-2 码(非法项会被忽略)array
exclude从全集(或 include 结果)中排除的 alpha-2array
namesLocale传给 i18n-iso-countriesgetNames(lang);未设置时按全局 locale.name 解析string
country-name-variantshort 常用简称(alias);full 正式全称(official)enumshort
show-alpha2-in-label为 true 时在标签中附带 (XX) 代码后缀,便于按代码过滤booleanfalse
disabled是否禁用(未设置时遵循表单禁用注入)boolean
clearable是否可清空booleantrue
filterable是否可搜索booleantrue
placeholder占位文本stringuniboot.select.placeholder
fit-input-width下拉宽度是否与输入框一致boolean / numberfalse
height下拉面板高度number274
item-height每项高度number34
empty-values空值判定,参见 config-providerarray
value-on-clear清空时的返回值string / number / boolean / Function

事件

名称说明类型
update:model-value选中值变化时触发Function
change值变化且已确认时触发同上
remove-tag多选移除标签时触发Function
visible-change下拉展开/收起Function
focus聚焦Function
blur失焦Function
clear点击清空时触发Function

暴露

名称说明
selectRef内部 USelectV2 实例
focus聚焦内部输入
blur失焦内部输入

工具方法

名称说明
resolveCountryNamesLocalelocale.name / 自定义语言解析为 getNames 所用语言码
buildCountrySelectOptions根据语言与 include / exclude 生成选项列表(高级用法)