Почему Typescript считает, что мое перечисление не определено?

Question

Я использую Typescript, Redux и React, и все они являются новыми для меня, так что, вероятно, есть простое исправление, которое я просто не вижу.

У меня есть файл actions.ts, который содержит перечисление вроде этого:

export enum AnimalTypes {
    CAT = 'CAT',
    DOG = 'DOG'
}

Я импортирую его в свой файл redurs.ts и пытался использовать его в операторе журнала следующим образом:

import {AnimalTypes} from './actions';

export function someFunction() {
    // Print the word "CAT"
    console.log(AnimalTypes[AnimalTypes.CAT]);
}

При попытке запустить мой сайт появляется следующая ошибка:

TypeError: Cannot read property 'CAT' of undefined
  at someFunction (reducer.ts:5)
  at combineReducers.js:20
  etc.

Моя среда IDE не выдает мне ошибок, а также TSLint. Я прочитал кучу онлайн, пытаясь найти ответ, но ближе всего я подошел к кому-то, у кого не было ключевого слова "export" в их enum, и я знаю.

Что здесь может происходить? Буду благодарен за любую помощь.

Спасибо.

EDIT: Проблема не в обратном отображении, а в любом использовании enum. Это было только самое короткое использование, которое я мог придумать. Я на самом деле использую его в выражении switch:

import {AnimalTypes} from './actions';

export function otherFunction(animal) {
    switch (animal.type) {
        case AnimalTypes.CAT:
            // Do stuff
}

Когда я строю код выше, я получаю эту ошибку Uncaught TypeError: Cannot read property 'CAT' of undefined

Answer 1

Я не смог воспроизвести ваш точный случай: я импортировал перечисление в своем редукторе и создал именно эту функцию, которая регистрировала перечисление, и это сработало.

Однако я столкнулся с той же проблемой в несколько ином контексте: я добавил импорт для моего перечисления AppRoutes в свой файл SideNav. Внутри файла SideNav, в const popularArticles, который отображался через некоторый JSON и возвращал некоторый TSX, когда я пытался <NavLink to={AppRoutes.something}>, я получил «не могу прочитать свойство что-то неопределенное», хотя при наведении курсора на AppRoutes.something в IDE мне показывали правильное значение из правильного источника. Я думаю, что это очень похоже на ваш случай, поэтому я надеюсь, что мое решение поможет будущим читателям столкнуться с этой проблемой.

Для меня было решено интегрировать const popularArticles (который находился вне класса SideNav) в переменную public popularArticles внутри класса непосредственно перед конструктором. Я не знаю почему, но после дальнейших экспериментов я обнаружил, что, очевидно, вы не можете получить доступ к enum вне класса или SFC ...

Answer 2

Эта особенность машинописи называется «обратным отображением», и согласно документации она поддерживается только с числовыми перечислениями. Вот фрагмент из https://www.typescriptlang.org/docs/handbook/enums.html:

Помимо создания объекта с именами свойств для членов, члены числовых перечислений также получают обратное отображение значений перечисления на перечислимые имена.