javascript - 两次使用 native 日期时间选择器会出错？

Question

我使用世博会的 datetime选择器，如果我只单击一次它就可以正常工作。如果我单击它两次，它会给我以下错误:

TypeError: value.getTime is not a function. (In 'value.getTime()','value.getTime' is undefined)

This error is located at:in RNDateTimePicker (at MyDateTimePicker.js:52)

这是我的日期时间选择器:

import React, { useState, useEffect } from 'react';
import { View, Text, TextInput, Image, Button, StyleSheet, TouchableOpacity } from 'react-native';
import DateTimePicker from '@react-native-community/datetimepicker';
import Moment from 'moment';

export default function MyDateTimePicker(props) {
  console.log("my date time picker props: ", props);
  const title = props.title;
  const [date, setDate] = useState(new Date());
  const [time, setTime] = useState(new Date());
  const [mode, setMode] = useState('date');
  const [show, setShow] = useState(false);
  const [text, setText] = useState(Moment(date).format('DD MMM YYYY HH:mm'));

  const onChange = (event, selectedValue) => {
    setShow(Platform.OS === 'ios');
    if (mode == 'date') {
     const currentDate = selectedValue || new Date();
     setDate(new Date(currentDate));
     setMode('time');
     setShow(Platform.OS !== 'ios'); // to show time
   } else {
     const currentTime = selectedValue || new Date();
     setDate(date.setTime(currentTime.getTime()));
     setShow(Platform.OS === 'ios'); // to hide back the picker
     setMode('date'); // defaulting to date for next open
   }
   props.updateDate(date);
  };

  const showMode = (currentMode) => {
    setShow(true);
    setMode(currentMode);
  };

  const showDatepicker = () => {
    console.log("show date picker");
    showMode('date');
  };

  const showTimepicker = () => {
    console.log("show time picker");
    showMode('time');
  };

  return(
    <View style={styles.viewStyle}>
      <TouchableOpacity onPress={showDatepicker}>
        <Text style={styles.inputStyle}>{text}</Text>
      </TouchableOpacity>
      {show && (
        <DateTimePicker
          value={date}
          mode={mode}
          is24Hour={true}
          display="default"
          onChange={onChange}
          minimumDate={new Date()}
          showTimeSelect
        />
      )}
    </View>
  )
}

这就是我使用它的方式:

<MyDateTimePicker updateDate={(date) => this.handleDate(date)} />

在哪里

handleDate(date) {
    this.setState({date: date});
  }

同样，如果我只单击一次日期时间选择器，一切正常，但如果我尝试选择第二个日期，它会中断，我不明白为什么。

Answer 1

问题在这里:

 setDate(date.setTime(currentTime.getTime()));

setTime返回从 1970 年 1 月 1 日开始的秒数(从 javascript 开发人员的 Angular 来看，这是创建世界的时间)，但数据选择器需要日期，而不是数字，因此它尝试调用 getTime在一个数字上，这并不顺利。
我不熟悉这个特定的数据选择器，但是如果您确定它在“时间”模式下丢失了日期部分，请尝试

setDate(new Date(date.getTime()+currentTime.getTime()));

如果这让你对 future 太遥远 setDate(currentTime)可能就足够了(仅适用于“时间”模式，“日期”部分很好)