如何在TypeScript中定义一种类型，该类型是一个字符串，只能包含预定义列表中的单词-PHP中文网问答

我有一个棘手的 TypeScript 问题。

假设我有一个具有道具大小的图标组件。大小可以是“2”、“4”、“6”。我将这些值映射到预定义的顺风类。

所以我这样输入

type SizeValues = '2' | '4' | '6';

function Icon({size = '4'}: {size: SizeValues}) {
   const sizeMap = {
     '2': 'w-2 h-2',
     '4': 'w-4 h-4',
     '6': 'w-6 h-6',
   };
 
   return My icon goes here
}

一切都很好。但是，如果我想根据我的屏幕尺寸有不同的尺寸怎么办？所以我想尝试拥有顺风顺水的良好语法。

因此，我将 Icon 组件重写为以下内容：

type SizeValues = ???

function Icon({size = '4'}: {size: SizeValues}) {
   const sizeMap = {
     '2': 'w-2 h-2',
     '4': 'w-4 h-4',
     '6': 'w-6 h-6',
     'md:2': 'md:w-2 md:h-2',
     'md:4': 'md:w-4 md:h-4',
     'md:6': 'md:w-6 md:h-6',
     'lg:2': 'lg:w-2 lg:h-2',
     'lg:4': 'lg:w-4 lg:h-4',
     'lg:6': 'lg:w-6 lg:h-6',
   };
 
   return  sizeMap[s]).join(' ').trim()}>My icon goes here
}

这很好用，但是我该如何输入呢？我读到 TypeScript 将来会支持正则表达式。这会让事情变得更容易，但是现在可以输入这个吗？

这不是一个真正的组件，所以请不要给我如何改进它的好建议。我只是想知道如何输入我的 size 属性，以便它按照我编码的方式工作。