[Bug] antd-design的DatePicker组件各个mode下在iOS模拟器显示异常

[wangvili]

💬 前提强调

• I have searched the issues of this repository and believe that this is not a duplicate.

🙋 描述详情/重现步骤

代码如下：
<DatePicker
value={this.state.dateTime}
onOk={this.startTimeConfirm}
onDismiss={this.startTimeCancel}
onChange={this.dateTimeonChange}
mode="date"
minDate={new Date()}
format="YYYY-MM-DD">
<List.Item arrow="horizontal">

*
{'用餐日期'}

</List.Item>

💻 运行环境

iOS

⚫️ npx react-native info输出信息

System:
OS: macOS 13.5.2
CPU: (10) arm64 Apple M2 Pro
Memory: 102.72 MB / 16.00 GB
Shell:
version: "5.9"
path: /bin/zsh
Binaries:
Node:
version: 20.0.0
path: /var/folders/kb/p5p48sk13csbptrctf07nlt00000gn/T/yarn--1699406317457-0.528649200214055/node
Yarn:
version: 1.22.19
path: /var/folders/kb/p5p48sk13csbptrctf07nlt00000gn/T/yarn--1699406317457-0.528649200214055/yarn
npm:
version: 9.8.1
path: /opt/homebrew/bin/npm
Watchman:
version: HEAD-fcdc2f1
path: /opt/homebrew/bin/watchman
Managers:
CocoaPods:
version: 1.13.0
path: /usr/local/bin/pod
SDKs:
iOS SDK:
Platforms:
- DriverKit 23.0
- iOS 17.0
- macOS 14.0
- tvOS 17.0
- watchOS 10.0
Android SDK:
API Levels:
- "28"
- "29"
- "30"
- "31"
- "33"
- "33"
Build Tools:
- 28.0.3
- 29.0.2
- 29.0.3
- 30.0.2
- 30.0.3
- 31.0.0
- 33.0.0
- 33.0.2
- 34.0.0
System Images:
- android-33 | Google APIs ARM 64 v8a
- android-UpsideDownCake | Google APIs ARM 64 v8a
Android NDK: Not Found
IDEs:
Android Studio: 2022.1 AI-221.6008.13.2211.9619390
Xcode:
version: 15.0.1/15A507
path: /usr/bin/xcodebuild
Languages:
Java:
version: 11.0.18
path: /usr/bin/javac
Ruby:
version: 3.0.0
path: /Users/inkcrazy/.rvm/rubies/ruby-3.0.0/bin/ruby
npmPackages:
"@react-native-community/cli": Not Found
react:
installed: 18.2.0
wanted: 18.2.0
react-native:
installed: 0.72.4
wanted: 0.72.4
react-native-macos: Not Found
npmGlobalPackages:
"react-native": Not Found
Android:
hermesEnabled: true
newArchEnabled: false
iOS:
hermesEnabled: true
newArchEnabled: false

补充说明

"react-native": "0.72.4",
antd | 5.0.4
React | 18.2.0
System | 13.5.2
Browser | 版本 119.0.6045.105（正式版本） (arm64)

下图都是用iOS模拟器运行

x

[wangvili]

希望至少mode的date类型可以正常显示

[reamal]

我也遇到了相同的问题，很急。谁能帮帮我呢。

[reamal]

ios：17
@ant-design/react-native: "^5.0.5"

import _ from 'lodash';
import React, { Component } from 'react';
import { View, Text, ScrollView } from 'react-native';
import { DatePickerView } from '@ant-design/react-native';
export default class DatePickerScreen extends Component {
    picker = React.createRef();
    state = {

    };
    render() {
        return (
            <ScrollView >
                <View>
                    <DatePickerView
                        onChange={(v) => { }}
                        use12Hours={true}>
                    </DatePickerView>
                </View>
            </ScrollView>
        );
    }
}

这是在ios上的表现

这是在android上的表现

[1uokun]

未来会考虑换一个方式实现DatePicker. 目前先建议一行不要展示过多Picker，分段选取

[reamal]

未来会考虑换一个方式实现DatePicker. 目前先建议一行不要展示过多Picker，分段选取

可以引入一些style让用户自己配置吗？

[1uokun]

ios是link的native模块暂时扩展不了；

android是完全用rn内置组件（ScrollView）实现的NativePicker.android.tsx，更灵活些后续可以扩展；

统一成android这样的实现方式最好维护，不过考虑到性能还需要调研一下，有兴趣可以一起实现

未来会考虑换一个方式实现DatePicker. 目前先建议一行不要展示过多Picker，分段选取

可以引入一些style让用户自己配置吗？

[reamal]

ios是link的native模块暂时扩展不了；

android是完全用rn内置组件（ScrollView）实现的NativePicker.android.tsx，更灵活些后续可以扩展；

统一成android这样的实现方式最好维护，不过考虑到性能还需要调研一下，有兴趣可以一起实现

未来会考虑换一个方式实现DatePicker. 目前先建议一行不要展示过多Picker，分段选取

可以引入一些style让用户自己配置吗？

好的，我找下其他方法。

[reamal]

ios是link的native模块暂时扩展不了；

android是完全用rn内置组件（ScrollView）实现的NativePicker.android.tsx，更灵活些后续可以扩展；

统一成android这样的实现方式最好维护，不过考虑到性能还需要调研一下，有兴趣可以一起实现

未来会考虑换一个方式实现DatePicker. 目前先建议一行不要展示过多Picker，分段选取

可以引入一些style让用户自己配置吗？

我可以在ios引用NativePicker.android.tsx这个组件么？

[FantasyGin]

我也遇到同样的问题了，在ios上不能正常显示年月日时分，显示的是"..."，这个组件不能再进行优化了吗？或者把每个item的样式可以给我们自己设置也行。

[onlyling]

要不考虑换一个 DatePicker 时间选择器。

[1uokun]

fixed in 5.1.0