反应原生错误:日期值不能从字符串转换为双精度 [英] react-native error : value for date cannot be cast from string to double

问题描述

所以，我有这个 reminder 组件，其中 textInput 是从 react-native 导入的，DatePicker 是从原生库导入的，还有一个按钮可以在点击事件时保存表单.

So, I have this reminder component with textInput being imported from react-native and DatePicker being imported from the native base and a button which will save the form on click event.

现在当我点击日期选择器时，它给出一个错误提示:日期值不能从字符串转换为双精度.我还附上了错误的截图.

now when I click on the datepicker, it gives an error saying: value for date cannot be cast from string to double. I have also attached a screenshot of the error.

不确定我哪里出错了.

这是组件的代码.

class Reminder extends Component {

    constructor(props) {
        super(props);
        let formatDate = new Date();
        this.state = {
            chosenDate: formatDate.toISOString().split('T')[0],
            text: '',
        };
        this.handleChangeInput = this.handleChangeInput.bind(this);
        this.saveData = this.saveData.bind(this);
    }


    render() { 
        const {chosenDate} = this.state;
        return ( 
            <View>
                <Form style={styles.formContainer}>
                    <View style={styles.formView}>

                        < TextInput
                            placeholder = "Set your reminder"
                            onChangeText={this.handleChangeInput}
                            value={this.state.text}
                        />

                        <DatePicker
                            defaultDate={chosenDate}
                            mode = "date"
                            animationType={"fade"}
                            androidMode={"default"}
                            placeHolderText="Select date"
                            textStyle={{ color: "green" }}
                            placeHolderTextStyle={{ color: "#d3d3d3" }}
                            onDateChange={(chosenDate) => this.setState({chosenDate})}
                        />
                        <Text style={styles.datePicker}>
                            {chosenDate}
                        </Text>
                    </View>
                    <View style={styles.footer}>
                        <Button block success style={styles.saveBtn} 
                            onPress={ () => 
                                    {
                                    this.saveData()
                                    //console.log('save data', fomattedState);
                                    Alert.alert('Yay!!', 'Succefully saved.')
                                    }
                                } 
                           >
                            <Icon type='MaterialIcons' name='done' />                        
                        </Button>
                    </View>
                </Form>
            </View> 
        );
    }

    handleChangeInput = (input) => {
        this.setState({
            text: input
        });
    }

    //save the input
    saveData() {
        let {chosenDate, ...restOfState} =  this.state;
        let textArray = Object.entries(restOfState).map(([key, value])=> ({[key]: value}));
        let fomattedState = {[chosenDate]:textArray};
        console.log('formatted state', fomattedState);
        AsyncStorage.setItem("key", JSON.stringify(this.fomattedState));
    }
}

推荐答案

我在这个 @react-native-community/datetimepicker 包中遇到了同样的问题.所以我用 Moment 库和 JavaScript Date.parse() 方法解决了这个问题:

I had the same issue in this @react-native-community/datetimepicker package. So I fixed this issue with the Moment library and JavaScript Date.parse() method:

const [targetDate, setTargetDate] = useState(
    new Date(
      Date.parse(
        moment(selectedGoal.targetDate, 'DD/MM/YYYY').format(
          'ddd MMM DD YYYY HH:mm:ss ZZ',
        ),
      ),
    ),
  );

这篇关于反应原生错误:日期值不能从字符串转换为双精度的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！