【问题标题】:datepickerIOS not coming on the screendatepickerIOS 没有出现在屏幕上
【发布时间】:2018-02-26 09:36:27
【问题描述】:

我有一行在单击该视图时显示日期,我希望弹出并显示一个日期选择器。

 class EditProfilePicture extends React.Component {
state = {
    currentDate: new Date()
};
setCurrentDateForIOS = currentDate => {
    this.setState({ currentDate });
};

pickDate = () => (
    <View>
        {Platform.OS === "ios" ? (
            <DatePickerForIOS
                setCurrentDateForIOS={this.setCurrentDateForIOS}
            />
        ) : (
            DatePickerForAndroid().then(currentDate =>
                this.props.changeBirthDate({ currentDate })
            )
        )}
    </View>
);
render() {
    return (
        <View>
            <View style={styles.Container}>
                <Text style={styles.heading}>Your birthday</Text>
                <TouchableWithoutFeedback onPress={this.pickDate}>
                    <View style={styles.dropdown}>
                        <Text style={styles.textStyle}>
                            {DateFormatter(this.state.currentDate)}
                        </Text>
                        <Icon name="chevron-down" color={MED_GREY} />
                    </View>
                </TouchableWithoutFeedback>
            </View>
        </View>
    );
}
}

在 DatePickerForIOS 我有这个---

 import React from "react";
 import PropTypes from "prop-types";
 import { DatePickerIOS } from "react-native";

 const DatePickerForIOS = props => {
   return (
    <DatePickerIOS
        date={new Date()}
        mode="date"
        onDateChange={() => props.setCurrentDateForIOS}
    />
);
};

DatePickerIOS.propTypes = {
 setCurrentDateForIOS: PropTypes.func.isRequired
 };

 export default DatePickerForIOS;

虽然代码适用于 android,但在 IOS 中,屏幕最初包含 NAN/NAN/NAN 作为文本,并且在单击视图时不会打开日期选择器。

【问题讨论】:

    标签: reactjs react-native datepicker react-native-android react-native-ios


    【解决方案1】:

    DatePickerIOS 需要成为EditProfilePicture 的渲染函数的一部分

    当前您从TouchableWithoutFeedback 创建组件 fromonPress

    你需要像docs这样说

    render() {
        return (
          <View style={styles.container}>
            <DatePickerIOS
              date={this.state.chosenDate}
              onDateChange={this.setDate}
            />
          </View>
        )
      }
    

    您需要隐藏/显示此状态布尔值才能打开关闭。 在不知道你的 Android 代码的情况下,我怀疑这就像一个弹出模式。

    另一种解决方案是使用像 react-native-modal-datetime-picker 这样的包,它在 iOS 和 Android 之间具有相同的界面

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2020-02-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多