更新记录

1.0.1（2025-07-14） 下载此版本

1、修复showCode设置无效bug

1.0.0（2025-07-14） 下载此版本

1、发布hy-countryPicker组件，选择国家区号

平台兼容性

uni-app(4.32)

uni-app x(4.32)

其他

hy-countryPicker

功能

登录页选择国家区号，附带国家旗帜图标

使用方法

默认样式是有 国旗 + 区号，如果不需要显示区号可以通过props里的showCode来控制 如果需要自定义其他样式，比如我这里需要右边有一个下拉箭头，可通过设置当前组件背景色透明，在父视图去定义。

template部分，设置样式

<view
  class="flex items-center justify-center bg-white rounded-xl px-3 h-96 border border-gray-200 relative">            
  <uv-icon
    class="px-1 pl-6"
    name="arrow-down"
    size="12"
    color="var(--c-helper_title)"></uv-icon>
  <view class="absolute left-0 top-0 right-0 bottom-0">
    <aure-country-picker
      v-model="countryCode"
      defaultCountryCode="US"
      :custom-style="{
        'height': '100%',
        'padding': '0',
        'padding-left': '30rpx',
        'background': 'transparent'
      }"
      :title="'Select Country'"
      :cancelText="'Cancel'"
      :searchPlaceholder="'Search Country or City'"
      :duration="350"
      :position="'bottom'"
      :round="true"
      :radius="'24rpx'"
      :mask-closable="true"
      @change="selectCountry"></aure-country-picker>
  </view>
</view>

JavaScript部分，处理选择事件。返回结果见右侧预览图。

selectCountry(e) {
  console.log(e, this.countryCode)
}