在 React 组件中支持 switch 语句中的可选参数

Question

从api我可以查询：

type 其中 returns 字符串 'Type A' 或 'Type B'
typeXy 其中 returns 字符串 'Type X' 或 'Type Y'

基于这些值，我想创建一个 switch 语句来获取正确的值。

const getLabel = (type?: string, typeXy?: string) => {
    switch (type || typeXy) {
      case 'Type A':
        return labelA;
      case 'Type B':
        return labelB;
      case 'Type X':
        return labelX;
      case 'Type Y':
        return labelY;
      default:
        return '';
    }
  };

然后在我的 React 组件中，我想通过 label 属性传递函数 getLabel() 以将正确的标签发送到子组件。

  return (
    <Grid
      items={data?.items?.map((node) => ({
        label: getLabel(node.type || node.typeXy),
      }))}
    />
  );

但是如何创建接受或 argument/field A 或 argument/field B 的 switch 语句？

然后在函数中它可以接受或字段A或字段B（node.type或node.typeXy）？

Answer 1

试试这个（原版 javascript）

const getLabel = (type, typeXy) => {
    switch (type || typeXy) {
      case 'Type A':
        return 'labelA';
      case 'Type B':
        return 'labelB';
      case 'Type X':
        return 'labelX';
      case 'Type Y':
        return 'labelY';
      default:
        return '';
    }
  };
  
console.log(getLabel('', 'Type Y'))
console.log(getLabel('Type A', ''))

在 React 组件中支持 switch 语句中的可选参数

Support optional arguments in switch statement in React component

javascript

function

switch-statement

reactjs