I'm working on my first TypeScript project and I'm having trouble add types correctly to my code. From the React Native Docs, DatePickerAndroid "returns a Promise which will be invoked an object containing action, year, month (0-11), day if the user picked a date.
For this next part, I've added "?" and undefined in the interface. "If the user dismissed the dialog, the Promise will still be resolved with action being DatePickerAndroid.dismissedAction and all the other keys being undefined."
I've tried several ways, but how can I correctly apply types to DatePickerAndroid?
Error:
src/DatePicker.tsx:47:15 - error TS2322: Type 'DatePickerAndroidOpenReturn' is not assignable to type 'Props'.
Type 'DatePickerAndroidDateSetAction' is missing the following properties from type 'Props': title, onValueChange, mode, date47
const { action, year, month, day } : Props = await DatePickerAndroid.open({
Interface:
// TypeScript: Types
interface Props {
title: string,
onValueChange: Function,
mode: 'calendar' | 'spinner' | 'default' | undefined,
action: 'dateSetAction' | 'dismissedAction',
date: Date | undefined,
minDate?: Date | undefined,
maxDate?: Date | undefined,
year?: number | Date,
month?: number | Date,
day?: number | Date,
}
DatePicker.tsx
const toggleModal = async (props: Props) => {
try {
// Check Platform (iOS)
if (Platform.OS === 'ios') {
// React Hook: Toggle Modal
toggle((modalVisible) => !modalVisible);
}
// Check Platform (Android)
if (Platform.OS === 'android') {
const { action, year, month, day } : Props = await DatePickerAndroid.open({
date: date,
mode: props.mode,
});
// Action: Date Set
if (action === DatePickerAndroid.dateSetAction) {
// New Date
let newDate:Date = new Date(year, month, day);
// Select Date
selectDate(newDate);
}
// Action: Dismissed
if (action === DatePickerAndroid.dismissedAction) {
// Do Nothing
}
};
}
catch (error) {
console.log(error);
}
};