如何使用枚举在 react/typescript 中保存 jsx [关闭]

Question

enum result{
    fail=（<StyleDiv>fail</StyleDiv>）,
 success=（<StyleDiv>success</StyleDiv>）
}
function(){
return result.fail
}

我该怎么做？ 我应该改变方法吗？

Answer 1

您需要创建一个带有键作为枚举成员的对象：

enum resultKeys {
  fail,
  success,
}

const result = {
  [resultKeys.fail]: <StyleDiv>fail</StyleDiv>,
  [resultKeys.success]: <StyleDiv>success</StyleDiv>, 
};

或者如果result 的每个成员都是相同的StyleDiv 组件，您可以只存储子元素作为结果中每个键的值：

enum resultKeys {
  fail,
  success,
}

const result = {
  [resultKeys.fail]: "fail",
  [resultKeys.success]: "success", 
};

function getStyleDiv(key: resultKeys): JSX.Element {
  return <StyleDiv>{result[key]}</StyleDiv>;
}

const fail = getStyleDiv(resultKeys.fail);