Typescript 中的递归类型声明

Question

我已经尝试了我能想到的所有方式，我确实查看了其他有关递归类型的类似帖子，但我无法创建一种递归适用于这种情况的类型。

我想要的是让这个类型接受CSSStyleDeclaration的部分属性，并且，对于任何与CSSStyleDeclaration属性不匹配的属性，我希望它映射回类型本身。

这似乎仅适用于第一级：

interface NestedCSSDeclarations {
[name: string]: CSSDeclaration;
}
type CSSDeclaration = {
[P in keyof CSSStyleDeclaration]?: CSSStyleDeclaration[P];
} & NestedCSSDeclarations
function css(obj: CSSDeclaration) {
// ...
}
let style = {
headline: css({
color: "red",
h1: {
color: "blue",
"&:hover": {
color: "green"
}
},
"@media screen and (min-width: 400px)": {
h1: {
fontSize: "50px"
}
}
})
}

没有办法打字提示吗？

Answer 1

如果您使用运算符而不是&|它将正常工作

type CSSDeclaration = {
[P in keyof CSSStyleDeclaration]?: CSSStyleDeclaration[P];
} | NestedCSSDeclarations