Ошибка подстановки/ссылки на строковые константы

#typescript

Вопрос:

Я пытаюсь использовать строковую константу из другого файла машинописи в качестве ключа в типе карты.

Вот простой пример:

src/common/model-constants.ts

 export default class Constants {
  public static readonly KEY_PREFIX: string = "x";
}
 

src/models/prop.ts

 export interface AProps {
  readonly key: {
    [key: string]: string;
  };
}
 

src/index.ts

 import Constants from "./common/model-constants";
import AProps from "./models/prop";

const prop: AProps = {
  a: "1"
};

const prop2: AProps = {
  Constants.KEY_PREFIX : "2"
}

const prop3: AProps.key = {};

prop3[Constants.KEY_PREFIX] = "3";
 

prop и prop3 работает, но prop2 не компилируется с

 /src/index.ts: Unexpected token (12:4)

  10 | var prop2 = {
  11 |     Constants: model_constants_1.default,
> 12 |     : .KEY_PREFIX, "2": 
     |     ^
  13 | };
  14 | var prop3 = {};
  15 | prop3[model_constants_1.default.KEY_PREFIX] = "3";

 

Вот то же самое в codesandbox : https://codesandbox.io/s/dreamy-bartik-2bbqx

Почему ссылка на константу строкового типа непосредственно в литерале карты не работает? Почему я вижу model_constants_1.default в консоли ошибки?

Комментарии:

1. Не совсем ясно, каковы ваши намерения здесь, но я потратил время, чтобы исправить ваш код как можно лучше… : Песочница

2. @spender Спасибо, что нашли время и исправили ошибки, но я думаю, что прокомментировал ту часть, которая давала ошибку в вопросе. Не могли бы вы раскомментировать строки 8,9 и 10 index.ts из вашей ссылки на песочницу, чтобы узнать, о чем мой вопрос?

Ответ №1:

То, что вы пытаетесь сделать, называется вычисляемым именем свойства и записывается следующим образом:

 const prop2: AProps = {
  [Constants.KEY_PREFIX] : "2"
}
 

Также подумайте о том, чтобы изменить AProps объявление или добавить key свойство к вашим объектам:

 class Constants {
  public static readonly KEY_PREFIX: string = "x";
}

interface AProps {
  readonly key: {
    [key: string]: string;
  };
}

const prop: AProps = {
  key: {
    a: "1"
  }
};

const prop2: AProps = {
  key: {
    [Constants.KEY_PREFIX] : "2"
  }
}

const prop3: AProps = { key: {} };

prop3.key[Constants.KEY_PREFIX] = "3";
 

Игровая площадка TS

Ответ №2:

Чтобы использовать вычисленное значение в качестве ключа объекта, необходимо использовать угловые скобки []

 const prop2: AProps = {
[ Constants.KEY_PREFIX] : "2" 

}