如何在Typescript中的泛型对象接口中进行描述?

时间:2018-11-02 14:10:53

标签: typescript

我有这样的对象

{
  classNames: {
    foo: 'foo',
    ....
    bar: 'bar'
  },
  method1: () => {....},
  method2: () => {....},
  stringKey1: 'stringKey1',
  ...
  stringKeyN: 'stringKeyN',
}

我需要描述函数的函数参数

function func1(myObj) { ... }

我的描述失败了

interface IMyObject {
  classNames: [key: string]: string;
  method1: Function;
  method2: Function;
  [key: string]: string | undefined;
}

错误:

  • 类型'[any,string]'的属性'classNames'不可分配给 字符串索引类型“字符串”。
  • 类型为“功能”的属性“方法1”为 不可分配给字符串索引类型'string'。
  • 的属性“方法2” 类型'Function'不能分配给字符串索引类型'string'。

1 个答案:

答案 0 :(得分:1)

您的问题是由尝试在该类型的“ exceptions”旁边指定索引类型引起的。

如果您看下面的代码(应该是您所需要的)-如果Example接口具有索引签名,则它将与其他成员冲突。例如method1不符合以下条件:[index: string]: string;

interface Example {
    classNames: { [index: string]: string; };
    method1: () => void;
    method2: () => void;
}

interface Example1 {
    [index: string]: string;
}

type ExampleUnion = Example | Example1;

const x: ExampleUnion = {
  classNames: {
    foo: 'foo',
    bar: 'bar'
  },
  method1: () => {},
  method2: () => {},
  stringKey1: 'stringKey1',
  stringKeyN: 'stringKeyN',
}

现在这会导致访问问题,因为两个接口仍然存在冲突。您可以使用自定义类型防护来解决此问题,但是采用其他形状可以一口气解决所有问题:

interface Example {
    classNames: { [index: string]: string; };
    propertyBag: { [index: string]: string; };
    method1: () => void;
    method2: () => void;
}

const x: Example = {
  classNames: {
    foo: 'foo',
    bar: 'bar'
  },
  method1: () => {},
    method2: () => { },
    propertyBag: {
        stringKey1: 'stringKey1',
        stringKeyN: 'stringKeyN',
    }
}