fix: 修复picker的内置空状态中文文案和空状态判断问题 (#1135)

* fix: 修复picker内置中文文案问题和空状态不展示问题

* fix: 修复picker内置中文文案问题和空状态不展示问题

* fix: 修复picker内置中文文案问题和空状态不展示问题

---------

Co-authored-by: shijia.sj <[email protected]>

Author: ajiaberry

compiled/alipay/demo/pages/Picker/index.axml

@@ -10,7 +10,8 @@
       placeholder="请选择"
       title="请选择"
       onChange="handleChange"
-      options="{{ list }}" />
+      options="{{ list }}"
+      emptyText="暂无数据" />
   </ant-list-item>
   <ant-list-item>
     选择城市（点击蒙层不关闭）

compiled/alipay/src/Picker/index.axml

@@ -55,7 +55,7 @@
   </view>
   <view class="ant-picker-content">
     <slot name="content-header" />
-    <block a:if="{{ columns }}">
+    <block a:if="{{ columns.length > 0 }}">
       <picker-view
         class="ant-picker-picker-view"
         mask-style="{{ maskStyle || '' }}"
@@ -87,7 +87,7 @@
       <picker-view>
         <picker-view-column>
           <!-- display: inline -->
-          <text style="color: #ccc">暂无数据</text>
+          <text style="color: #ccc">{{ emptyText }}</text>
         </picker-view-column>
       </picker-view>
     </block>

compiled/alipay/src/Picker/index.md

@@ -40,6 +40,7 @@ Picker 选择器显示一个或多个选项集合的可滚动列表，相比于
 | maskClosable |  点击蒙层是否可以关闭 | boolean |true |  | 
 | maskStyle | 蒙层的样式 | string | - | 
 | okText | 确认按钮文案 | string | '确定' |  
+| emptyText | 空状态按钮文案 | string | '暂无数据' |  
 | options | picker 数据，配置每一列的选项 | [PickerColumnItem](#pickercolumnitem)[] | [] |
 | placeholder | 提示文案 | string | '请选择' |  
 | popClassName |  弹出框类名 | string | - |

compiled/alipay/src/Picker/props.ts

@@ -54,6 +54,11 @@ export interface IPickerProps extends IBaseProps {
    * @default '请选择'
    */
   placeholder: string;
+   /**
+   * @description 空状态提示文案
+   * @default '暂无数据'
+   */
+  emptyText?: string;
   /**
    * @description picker 数据
    */
@@ -133,6 +138,7 @@ export const PickerDefaultProps: Partial<IPickerProps> = {
   options: [],
   placeholder: '请选择',
   defaultValue: [],
+  emptyText: '暂无数据'
 };
 
 export const PickerFunctionalProps: Partial<IPickerProps> = {
@@ -152,4 +158,5 @@ export const PickerFunctionalProps: Partial<IPickerProps> = {
   popStyle: '',
   maskClosable: true,
   onFormat: null,
+  emptyText: '暂无数据'
 };

compiled/wechat/demo/pages/Picker/index.wxml

@@ -10,7 +10,8 @@
       placeholder="请选择"
       title="请选择"
       bind:change="handleChange"
-      options="{{ list }}" />
+      options="{{ list }}"
+      emptyText="暂无数据" />
   </ant-list-item>
   <ant-list-item>
     选择城市（点击蒙层不关闭）

compiled/wechat/src/Picker/index.md

@@ -40,6 +40,7 @@ Picker 选择器显示一个或多个选项集合的可滚动列表，相比于
 | maskClosable |  点击蒙层是否可以关闭 | boolean |true |  | 
 | maskStyle | 蒙层的样式 | string | - | 
 | okText | 确认按钮文案 | string | '确定' |  
+| emptyText | 空状态按钮文案 | string | '暂无数据' |  
 | options | picker 数据，配置每一列的选项 | [PickerColumnItem](#pickercolumnitem)[] | [] |
 | placeholder | 提示文案 | string | '请选择' |  
 | popClassName |  弹出框类名 | string | - |

compiled/wechat/src/Picker/index.wxml

@@ -50,7 +50,7 @@
   </view>
   <view class="ant-picker-content">
     <slot name="content-header" />
-    <block wx:if="{{ columns }}">
+    <block wx:if="{{ columns.length > 0 }}">
       <picker-view
         class="ant-picker-picker-view"
         mask-style="{{ maskStyle || '' }}"
@@ -82,7 +82,7 @@
       <picker-view>
         <picker-view-column>
           <!-- display: inline -->
-          <text style="color: #ccc">暂无数据</text>
+          <text style="color: #ccc">{{ emptyText }}</text>
         </picker-view-column>
       </picker-view>
     </block>

compiled/wechat/src/Picker/props.js

@@ -6,6 +6,7 @@ export var PickerDefaultProps = {
     options: [],
     placeholder: '请选择',
     defaultValue: [],
+    emptyText: '暂无数据'
 };
 export var PickerFunctionalProps = {
     formattedValueText: null,
@@ -24,4 +25,5 @@ export var PickerFunctionalProps = {
     popStyle: '',
     maskClosable: true,
     onFormat: null,
+    emptyText: '暂无数据'
 };

demo/pages/Picker/index.axml.tsx

@@ -28,6 +28,7 @@ export default ({
           title="请选择"
           onChange="handleChange"
           options={list}
+          emptyText="暂无数据"
         ></AntPicker>
       </AntListItem>
       <AntListItem>

src/Picker/index.axml.tsx

@@ -30,6 +30,7 @@ export default (
     indicatorStyle,
     indicatorClassName,
     options,
+    emptyText
   }: TSXMLProps<IPickerProps>,
   { state, formatValue, selectedIndex, columns }: InternalData
 ) => (
@@ -98,7 +99,7 @@ export default (
       </View>
       <View class="ant-picker-content">
         <Slot name="content-header" />
-        {columns ? (
+        {columns.length > 0 ? (
           <Block>
             <PickerView
               class="ant-picker-picker-view"
@@ -127,7 +128,7 @@ export default (
           <Block>
             <PickerView>
               <PickerViewColumn>
-                <Text style="color: #ccc">暂无数据</Text>
+                <Text style="color: #ccc">{emptyText}</Text>
               </PickerViewColumn>
             </PickerView>
           </Block>

src/Picker/index.md

@@ -40,6 +40,7 @@ Picker 选择器显示一个或多个选项集合的可滚动列表，相比于
 | maskClosable |  点击蒙层是否可以关闭 | boolean |true |  | 
 | maskStyle | 蒙层的样式 | string | - | 
 | okText | 确认按钮文案 | string | '确定' |  
+| emptyText | 空状态按钮文案 | string | '暂无数据' |  
 | options | picker 数据，配置每一列的选项 | [PickerColumnItem](#pickercolumnitem)[] | [] |
 | placeholder | 提示文案 | string | '请选择' |  
 | popClassName |  弹出框类名 | string | - |

src/Picker/props.ts

@@ -54,6 +54,11 @@ export interface IPickerProps extends IBaseProps {
    * @default '请选择'
    */
   placeholder: string;
+   /**
+   * @description 空状态提示文案
+   * @default '暂无数据'
+   */
+  emptyText?: string;
   /**
    * @description picker 数据
    */
@@ -133,6 +138,7 @@ export const PickerDefaultProps: Partial<IPickerProps> = {
   options: [],
   placeholder: '请选择',
   defaultValue: [],
+  emptyText: '暂无数据'
 };
 
 export const PickerFunctionalProps: Partial<IPickerProps> = {
@@ -152,4 +158,5 @@ export const PickerFunctionalProps: Partial<IPickerProps> = {
   popStyle: '',
   maskClosable: true,
   onFormat: null,
+  emptyText: '暂无数据'
 };