Проблема с типизацией объекта TypeScript - при использовании предопределенного типа с нулем

Question

У меня есть следующее type.

type Team = 'liverpool' | 'manUtd' | 'arsenal' | null;

У меня есть следующий объект.

const teams: Record<Team, JSX.Element> = {
  liverpool: <Liverpool />,
  manUtd: <ManU />,
  arsenal: <Arsenal />,
};

Если я использую teams в качестве первой части Record Я вижу следующую ошибку:

Type 'Team' does not satisfy the constraint 'string | number | symbol'.
  Type 'null' is not assignable to type 'string | number | symbol'.ts(2344)

Если я использую Record<string, JSX.Element>, она работает нормально.

Answer 1

Тип для Record - Record<K extends string | number | symbol, T>.

Таким образом, первый тип, который вы указываете для Record, должен быть string, number или symbol. Вы не можете присвоить ему null, чтобы ваш тип Team не удовлетворял ограничению. Вы должны удалить null из вашего Team типа, и он будет работать как шарм.

Answer 2

Record<NonNullable<Team>, JSX.Element>

Дайте мне знать, если это поможет. эта ошибка возникает из-за того, что null не является допустимым типом ключа объекта JavaScript.