如何在类型定义上使用部分计算的属性名称

Question

我需要为接收 propname(应该是Fields的值(和任何其他 prop 的 React 组件定义类型。

所以我尝试了类似的东西

type Fields = 'address' | 'recipientName' | 'recipientPhone';
type Props = {
name: Fields
[key in string]: any // error here
};

但它不起作用。我收到此错误：

类型文本

中的计算属性名称必须引用类型为文本类型或"唯一符号"类型的表达式。

如何创建此类型？

Answer 1

您使用的是映射类型语法，而不是普通字典语法。试试这个：

type Fields = 'address' | 'recipientName' | 'recipientPhone';
type Props = {
name: Fields
[key: string]: any // All good
};

这可能就是你要找的。但是，如果出于某种原因确实想要使用映射类型以及单独的键，则需要定义两种类型并将它们相交，如下所示：

type Fields = 'address' | 'recipientName' | 'recipientPhone';
type Props = {
name: Fields
} & {
[key in string]: any // All good
};

不过，只有当key in string或any将变得更加复杂时，您才需要它。