在TypeScript界面​​中定义requiredIf成员

Question

I have the following prop type definition:

const calendarEventPropType = PropTypes.shape({
    id: PropTypes.string.isRequired,
    startDate: PropTypes.instanceOf(Date).isRequired,
    endDate: PropTypes.instanceOf(Date).isRequired,
    title: PropTypes.string.isRequired,
    type: PropTypes.oneOf(['stay']).isRequired,
    stay: requiredIf(stayPropType, props => props.type === 'stay'),
});

I am trying to convert this definition into TypeScript. I made the following:

interface ICalendarLayer {
    id: Number;
    startDate: Date;
    endDate: Date;
}

export interface ICalendarEvent extends ICalendarLayer {
    title: string;
    type: string;
    stay?: IStay;
}

But I want to be more specific. Means that if type equals "stay", stay member must contain IStay implementation. And otherwise, stay can be empty.
How can I define that as an interface in TypeScript?

Answer 1

Use a Union type:

 interface IRegularEvent extends ICalendarLayer {
   title: string;
   type: "someother" | "type";
   // stay?: IStay; // not sure if you need that?
 }

 interface IStayEvent extends ICalendarLayer {
   type: "stay";
   stay: IStay;
 }

 export type ICalendarEvent = IRegularEvent | IStayEvent;

Answer 2

interface ICalendarLayer { id: Number; startDate: Date; endDate: Date; } export interface ICalendarEvent extends ICalendarLayer { title: string; type: string; stay?: boolean; } function ChildTest(props: ICalendarEvent) { const {endDate,id,startDate,stay,title,type} = props; return(<></>); } function ParentTest(params:any) { const [stay, setStay] = useState(false) const actionStay = () => { /* if stay control */ setStay(!stay); } return( <> <ChildTest endDate={new Date()} startDate={new Date()} id={1} stay={stay} title="lorem" type="lorem" /> <button onClick={actionStay}></button> </> );