uniapp picker组件 国际化日语 韩语 "uni.picker.done": "完了", "uni.picker.cancel": "キャンセル", 不生效

欢迎到专业群（ uni-app 官方技术交流群 1 ） 咨询，群中有相关专业的管理员和群友。

根据知识库中的信息，您遇到的 picker 组件在日语、韩语环境下 uni.picker.done 和 uni.picker.cancel 国际化不生效 是一个已知的框架缺陷。

问题确认

这是一个已确认的 bug，影响范围包括：

• 平台：App 端（Android/iOS）
• 语言：日语、韩语、意大利语、俄语、泰语等（中文和英文通常正常）
• 组件：内置 picker 组件（包括日期、时间、普通选择器）
• 表现：配置 uni.picker.done 和 uni.picker.cancel 后仍显示英文 "Done" 和 "Cancel"

相关社区反馈：

• Bug 报告 1：日语环境下失效
• Bug 报告 2：多语言环境下失效
• Bug 报告 3：泰语配置未生效

临时解决方案

在官方修复前，建议采用以下替代方案：

方案一：使用 picker-view 自定义（推荐）

使用 picker-view 组件完全自定义底部按钮，绕过内置 picker 的国际化问题：

<template>  
  <view>  
    <view @click="showPicker = true">打开选择器</view>  

    <!-- 自定义弹层 -->  
    <view v-if="showPicker" class="custom-picker-mask" @click="showPicker = false">  
      <view class="custom-picker" @click.stop>  
        <!-- 自定义头部按钮 -->  
        <view class="picker-header">  
          <text @click="handleCancel">{{$t('uni.picker.cancel')}}</text>  
          <text @click="handleConfirm">{{$t('uni.picker.done')}}</text>  
        </view>  
        <!-- picker-view 内容 -->  
        <picker-view :value="selectedIndex" @change="onChange">  
          <picker-view-column>  
            <view v-for="(item, index) in array" :key="index">{{item}}</view>  
          </picker-view-column>  
        </picker-view>  
      </view>  
    </view>  
  </view>  
</template>  

<script>  
export default {  
  data() {  
    return {  
      showPicker: false,  
      array: ['选项1', '选项2', '选项3'],  
      selectedIndex: [0]  
    }  
  },  
  methods: {  
    onChange(e) {  
      this.selectedIndex = e.detail.value  
    },  
    handleCancel() {  
      this.showPicker = false  
    },  
    handleConfirm() {  
      console.log('选中值:', this.array[this.selectedIndex[0]])  
      this.showPicker = false  
    }  
  }  
}  
</script>  

<style>  
.custom-picker-mask {  
  position: fixed;  
  top: 0;  
  left: 0;  
  right: 0;  
  bottom: 0;  
  background: rgba(0,0,0,0.6);  
  z-index: 999;  
}  
.custom-picker {  
  position: absolute;  
  bottom: 0;  
  left: 0;  
  right: 0;  
  background: #fff;  
}  
.picker-header {  
  display: flex;  
  justify-content: space-between;  
  padding: 20rpx 30rpx;  
  border-bottom: 1px solid #eee;  
}  
</style>

本助手使用国产模型，生成代码可能不准确。专业的代码生成需要全球顶尖的AI Coding模型。推荐使用uni-agent

方案二：使用插件市场组件

使用支持自定义按钮文案的第三方 picker 组件，如：

• lime-picker：支持通过 cancel-btn 和 confirm-btn 属性直接传入国际化文本
• r-picker：支持 confirmButtonText 和 cancelButtonText 属性

这些组件不依赖内置的国际化机制，可以直接绑定您的 i18n 变量。

方案三：条件编译（针对 App 端）

如果必须保留内置 picker，可以在 App 端使用条件编译隐藏原生按钮，通过外部按钮控制：

<!-- #ifdef APP-PLUS -->  
<view class="app-picker-wrapper">  
  <picker   
    mode="selector"   
    :range="array"   
    @change="onChange"  
    :disabled="false">  
    <view>{{array[index]}}</view>  
  </picker>  
  <!-- 覆盖原生按钮区域，使用绝对定位自定义按钮 -->  
  <view class="custom-btn-group">  
    <text @click="cancel">{{$t('common.cancel')}}</text>  
    <text @click="confirm">{{$t('common.done')}}</text>  
  </view>  
</view>  
<!-- #endif -->  

<!-- #ifndef APP-PLUS -->  
<picker mode="selector" :range="array" @change="onChange">  
  <view>{{array[index]}}</view>  
</picker>  
<!-- #endif -->

本助手使用国产模型，生成代码可能不准确。专业的代码生成需要全球顶尖的AI Coding模型。推荐使用uni-agent

总结

目前该问题在 HBuilderX 4.45 及以下版本 中仍然存在。建议：

1. 短期：使用上述自定义方案或插件市场组件规避
2. 长期：关注 DCloud 官方更新日志，等待框架修复

如果您使用的是 uni-app x 项目，建议直接使用 picker-view 自行封装，因为 uni-app x 的组件体系与 uni-app 不同，此问题可能表现不一致。