Typescript -使用枚举作为索引签名类型时没有索引签名

Question

我的类型结构如下：

export type Method1 = (id: string, param: string) => Promise<any>

export enum ValuesList {
  VALUE1 = 'VALUE1',
  VALUE2 = 'VALUE2'
}

export type ValuesMap = {
  [key in ValuesList]: {
    callMethod: Method1
  }
}

export const methodsMap: ValuesMap = {
  [ValuesList.VALUE1]: {
    callMethod: lib.method
  },
  [ValuesList.VALUE2]: {
    callMethod: lib2.method
  }
}

在应用程序的某些部分，我想映射一些列表来动态调用这个方法：

methodsMap[target].callMethod(data.id, data.param)

按typescript返回以下问题：

Element implicitly has an 'any' type because type 'ValuesMap' has no index signature.ts(7017)

Typescript不能将ValuesMap识别为具有索引元素。如果我将ValuesMap更改为使用[key: string]而不是[key in ValuesList]，它可以工作，但我希望保留[key in ValuesList]

Answer 1

首先，让我们回顾一下一些术语。在TypeScript中，索引签名可以是字符串或数字，但不能更窄。如果不是只使用string类型，而是通过文字显式指定类型，这称为属性，而不是索引签名。这就是为什么枚举没有类型签名，却有属性的原因。

type A = {
   [key: string]: number // this is index signature
};

type B = {
   [key in 'foo' | 'bar']: number // this is a property 
}

现在来看实际的代码。您发布的代码片段似乎工作正常。当您将鼠标悬停在名称ValuesMap上时，工具提示会显示它是：

type ValuesMap = { VALUE1: { callMethod: Method1; }; VALUE2: { callMethod: Method1; }; }

因此，实际上，它包含来自Enum的两个值。因此，问题必须出在用作索引的target上。因为TypeScript抱怨看不到索引签名，所以我最好的猜测是您使用的target是string类型，因此可能不是该枚举的值。(您可以将鼠标悬停在其上方以查看其类型。)由于TypeScript希望保护您不调用未定义的callMethod，因此它会一直对您大喊大叫，直到您将target限制为正确的值。

Answer 2

如果要使用enum作为变量来检查值，请执行以下操作：

如果你有

export enum ValuesList {
  VALUE1 = 'VALUE1',
  VALUE2 = 'VALUE2'
}

然后使用：

someVariable: { [key: string]: ValuesList } = ValuesList

而不是：

someVariable: ValuesList = ValuesList