typescript扩展接口不允许覆盖属性

时间:2017-03-03 10:50:41

标签: typescript typing

Typescript显然不允许我覆盖不需要的属性。 我有几个接口:

interface IField {

  label:                string;
  model:                string;
  placeholder?:         string;
  addon?:               string;
  showOn?:              IDictionary <string | number>;
  maxlength?:           number;

}
interface ICheckboxField extends IField {

  model?:               string;
  type:                 'checkbox';
  default?:             string;
  options:              IOption[];
  validation?:    {
    required?:          string;
  };
}

所以在ICheckboxField中我将model属性设置为不需要。 扩展IField的所有其他字段都需要具有所需的模型。

这是Typescript中的限制还是除了扩展接口而只是添加专门用于接口的属性之外还有其他解决方案吗?

2 个答案:

答案 0 :(得分:2)

您可以做的是将IFieldICheckboxField的共享属性放在共享界面中:

interface IBase {
    label: string;
    placeholder?: string;
    addon?: string;
    showOn?: IDictionary;
    maxlength?: number;
}

interface IField extends IBase {
    model: string;
}

interface ICheckboxField extends IBase {
    model?: string;
    type: 'checkbox';
    default?: string;
    options: IOption[];
    validation?: {
        required?: string;
    };
}

另一种选择是将IField分成两个界面:

interface IField {
    label: string;
    placeholder?: string;
    addon?: string;
    showOn?: IDictionary;
    maxlength?: number;
}

interface IFieldOptionalModel extends IField {
    model?: string;
}

interface IFieldMandatoryModel extends IField {
    model: string;
}

interface ICheckboxField extends IFieldOptionalModel {
    type: 'checkbox';
    default?: string;
    options: IOption[];
    validation?: {
        required?: string;
    };
}

答案 1 :(得分:0)

您尝试覆盖严格类型(IField),其中属性是强制性的,具有更宽松的类型(ICheckboxField),这是强制性的。

编译器对此表示不满,但可能相反:

interface Loose {
  label:string;
  model?:string;
}

interface Strict extends Loose {
  model:string;
}

var a:Loose = {
  label:"bar",
}

var b:Strict = {
  label: "baz",
  model: "me"
}

因此,您可以在两者之上添加另一个界面,其中模型字段被定义为可选,然后在IField中将其重新定义为必需。

另一种选择可能是使用keyof和查找类型added in TypeScript 2.1