如何在 typescript 中有条件地使接口中的字段成为可选或必需？

Question

我将 typescript 与 react 一起使用，并且我希望组件仅在该问题是isDraggable = true 时才需要道具DragActions 。

我试过这样的东西，知道它可能不正确。

type IDragPayload = {
  dragHandleProps: any;
};
type TDragActions = {
  isDraggable : true, dragActions : IDragPayload
} | {isDraggable : false, dragActions? : never};

interface IQuestionCard
{
    isDraggable:boolean;
    DragActions : TDragActions;
}

const foo:IQuestionCard = {
    isDraggable : false
}

Answer 1

你快到了，只需将parentQuestion可选：

type TParentQuestion = {
    isSubQuestion: true,
    parentQuestion: Question
} | { isSubQuestion: false, parentQuestion?: never }


interface Question {
    isSubQuestion?: boolean,
    parentQuestion: TParentQuestion
}

declare const question: Question;

const foo: TParentQuestion = { //OK
    isSubQuestion: false
}

const bar: TParentQuestion = { // OK
    isSubQuestion: true,
    parentQuestion: question
}

const baz: TParentQuestion = { // KO
    isSubQuestion: false,
    parentQuestion: question
}

操场