Emotion-Theming 和 Typescript 需要 `theme` 道具答案

【问题标题】：Emotion-Theming and Typescript requires `theme` propEmotion-Theming 和 Typescript 需要 `theme` 道具
【发布时间】：2019-07-18 20:52:59
【问题描述】：

我有一个样式化组件定义为：

export const Header = styled('header')`
  grid-area: header;
  border-top:solid 3px ${(props) => {
    return props.theme.colors.primary
  }};
`

然后将其用作：

<Header>FOO</Header>

在另一个组件中。

我在使用 Typescript 时遇到的问题是，通过在样式组件中使用 props.theme，现在需要在使用 Header 时传递 theme 属性。实际情况并非如此，因为 props.theme 来自 App 结构中使用的 ThemeProvider。

如何使主题道具可选？

【问题讨论】：

【解决方案1】：

如果您在某处定义了接口，则可以用问号将其标记为可选：

interface Props {
    theme?: object; //Or whatever type it is
}

【讨论】：