javascript - TypeScript:一个接口(interface)属性需要另一个属性为真

标签 javascript angularjs reactjs typescript redux

如何定义键:a, b, c, bar作为未定义/空/可选输入如果 foo 是假的 ?换句话说,我需要这些属性是 必填 仅当 foo 是真的 .

interface ObjectType {
  foo: boolean;
  a: number;
  y: string;
  c: boolean;
  bar?: { x: number; y: string; z: boolean };
}
谢谢! :)

最佳答案

我认为最直接的方法是简单地使用联合类型。

interface RequiredObjectType {
  foo: true;
  a: number;
  y: string;
  c: boolean;
  bar: { x: number; y: string; z: boolean };
}

interface OptionalObjectType {
  foo: false;
  a?: number;
  y?: string;
  c?: boolean;
  bar?: { x: number; y: string; z: boolean };
}

type AnyObjectType = RequiredObjectType| OptionalObjectType;
如果需要,您当然可以将重复的属性抽象出来,以节省对将随时间更改的类型的输入。
interface ObjectTypeValues {
  a: number;
  y: string;
  c: boolean;
  bar: { x: number; y: string; z: boolean };
}

interface RequiredObjectType extends ObjectTypeValues {
  foo: true
}

interface OptionalObjectType extends Partial<ObjectTypeValues> {
  foo: false
}

type AnyObjectType = RequiredObjectType | OptionalObjectType;
您还将免费获得类型推断。
if (type.foo) {
  // im the required type!
  // type.a would be boolean.
} else {
  // im the optional type.
  // type.a would be boolean?
}

关于javascript - TypeScript:一个接口(interface)属性需要另一个属性为真,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/64933861/

相关文章:

javascript - 使用 jQuery 在 head 中添加元标记可以吗?

Java 脚本引擎 : using value on Java side?

angularjs - Webpack模式生产NODE_ENV仍然未定义

reactjs - `className` 属性和新的 MUI 系统实用程序 `sx` 属性之间的区别?

javascript - 通过对象数组进行映射

javascript - 获取多个 div 之间的距离(水平距离,即左边界到右边界 - 以像素为单位)

javascript - Threejs BufferGeometry - 用其他纹理渲染一些面

javascript - Symfony2 - 与 AngularJS 捆绑在一起

javascript - md-button 内的 Font Awesome 图标对齐

reactjs - 为什么我的 React 组件库不可进行树摇动?