I am building a form and this 2 things are behaving bad,
when i press on either of the button and select any date or time, it shoes the above mentioned error from the header as
‘Invariant Violation: value
prop must be an instance of Date object’
Moreover it also crashes the app builded up on the device emulator
import RNDateTimePicker from '@react-native-community/datetimepicker';
import React,{ useState } from 'react';
import { StyleSheet, Text, TouchableOpacity, View } from 'react-native';
export default function App() {
const [datePicker,setDatePicker] = useState(false)
const [datei, setDatei] = useState(new Date())
const [timePicker,setTimePicker] = useState(false)
const [time,setTime] = useState(new Date(Date.now()))
function showDatePicker(){
setDatePicker(true)
}
function showTimePicker(){
setTimePicker(true)
}
function OnDateSelected(datei){
setDatei(datei);
setDatePicker(false)
}
function onTimeSelected(time){
setTime(time);
setTimePicker(false)
}
return (
<View style={styles.container}>
{datePicker && (
<RNDateTimePicker
value={datei}
mode={'date'}
// display={Platform.0S === 'ios' ? 'spinner' : 'default'}
is24Hour={true}
onChange={OnDateSelected}
style={styles.datePicker}
/>
)}
{timePicker && (
<RNDateTimePicker
value={time}
mode={'time'}
// display={Platform.0S === ‘ios' ? 'spinner' : ‘default'}
is24Hour={false}
onChange={onTimeSelected}
style={styles.datePicker}
/>
)}
{!datePicker && (
<View>
<TouchableOpacity
onPress={showDatePicker}
style={[styles.button, styles.buttonOutline]}
>
<Text style={styles.buttonOutlineText}>D A T E</Text>
</TouchableOpacity>
</View>
)}
{!timePicker && (
<View>
<TouchableOpacity
onPress={showTimePicker}
style={[styles.button, styles.buttonOutline]}
>
<Text style={styles.buttonOutlineText}>T I M E</Text>
</TouchableOpacity>
</View>
)}
2
Answers
@gaurav-roy This is the following code that is what i am saying about, and by inputting 1st sept 2022, 12:00 pm
the output shows 2022-09-16T06:06:05.570Z
Basically
The above functions had problem ,since first param was event and you were setting event as value, you need to set Date or time.
Its working now .
Check this example
https://snack.expo.dev/@gaurav1995/fascinated-donut
Hope it helps. Feel free for doubts