Question

在这里我有一个特殊的情况，我有一个React按钮，该按钮具有一个由枚举定义的类，该按钮通过switch语句选择正确的类，测试枚举的每个成员。这是硬编码的，并且此组件可以正常工作（下面的代码）。

import * as React from 'react';
import './SquareButton.css';

export interface Props {
    buttonType: ButtonType;
    style?: object;
}

const SquareButton = ({ buttonType, style }: Props) => {

    var className = "";
    switch (buttonType) {
        case ButtonType.Hamburger:
            className = "zmdi zmdi-menu zmdi-hc-2x";
            break;
        case ButtonType.Clock:
            className = "zmdi zmdi-time zmdi-hc-2x";
            break;
        case ButtonType.Wifi:
            className = "zmdi zmdi-network-wifi zmdi-hc-2x";
            break;
        default:
            break;
    }

    return (
        <div className="squareButton" style={style} >
            <i className={className} />
        </div>
    )
}

export enum ButtonType {
    Wifi,
    Hamburger,
    Clock
}

export default SquareButton;

我在测试此组件时遇到的问题是，由于enum ButtonType的列表可能会增加，我希望能够遍历每种按钮类型而不必编写单独的测试或为每个按钮添加新的测试时候有一个新按钮。下面是测试示例。

for (var i = 0; i < Object.keys(ButtonType).length / 2; i++) {
    test(ButtonType[i] + 'square button icon class must contain zmdi', () => {
        const button = Enzyme.shallow(<SquareButton buttonType={i as ButtonType} />)
        expect(button.find('div').find('i').hasClass("zmdi")).toEqual(true);
    });
}

这成功地循环了枚举中的每个成员，但是我不知道如何在循环中获取特定的枚举实例以传递给组件。传递i as ButtonType仍仅传递一个int值，并且命中了开关中的默认值。我已经尝试了许多变体/字符串转换等，但是没有尝试过（如果我对（例如）ButtonType.Wifi值进行硬编码，则测试可以工作）。

如何从整数值中获取特定的枚举成员？

Answer 1

在这种情况下，i整数已经是期望值，ButtonType.Hamburger === 0等。

遍历枚举的问题是枚举值不一定是数字，并且枚举键的一半不必是数字索引。

enum A {
        B,
        C,
        D = 'D'
}

产生以下键：

["0", "1", "B", "C", "D"]

一种故障保护方法是：

for (const enumKey of Object.keys(ButtonType).filter(key => isNaN(+key))) {
  const enumVal = ButtonType[enumKey] as ButtonType;

  test(`ButtonType.${enumKey} square button icon class must contain zmdi`, () => {
    const button = Enzyme.shallow(<SquareButton buttonType={enumVal} />)
    ...
  })
}

由于最好同时测试ButtonType之类的特定于zmdi-menu的类，因此还应该有相应的测试，因此可能不需要带有迭代的通用测试。

从Typescript中的int获取特定的枚举成员

1 个答案: