TypeScript 元素隐含一个“任何”

Question

我对 TypeScript 有一些问题。 我正在尝试将一些来自父组件的值转换为子组件。 Parent 发送的值可以是 EN、FR 或 NL，而我应该将这些值转换为数字，所以我这样做了：

const transform_translation = {
      'EN': 1,
      'FR': 2,
      'NL': 3
    };

但是当我尝试获得像transform_translation[props.language]这样的价值时，它说；

S7053：元素隐式具有“any”类型，因为“any”类型的表达式不能用于索引类型“{ EN: number; FR：数字； 荷兰：

道具：

props: {
    language: {
      type: String,
      default: ['EN', 'NL', 'FR'],
      required: true
    },
.
.
.
}

那我应该如何定义它们呢？ 我第一次和 TS 一起工作。

数字; }'。

Answer 1

您应该告诉 ts 您传递的内容不仅是字符串，而且仅限于您拥有的语言的可用键：

const transform_translation = {
  EN: 1,
  FR: 2,
  NL: 3
};

// create type out of valid keys of object
type Language = keyof typeof transform_translation;

const getLanguageNum = (lang: Language) => transform_translation[lang];

console.log(getLanguageNum("EN")); // 1

Answer 2

我会像这样创建一个枚举或键入密钥。 然后在访问它时，您可以将密钥转换为如下类型

type ITransformTranslationKey = 'EN' | 'FR' | 'NL';
const transform_translation: Record<ITransformTranslationKey, number> = {
      'EN': 1,
      'FR': 2,
      'NL': 3
    };

const someVar: ITransformTranslationKey = 'E' + 'N'; // you can define the type here
transform_translation[someVar as ITransformTranslationKey] // or here