样式化的组件道具的流式输入不起作用 [英] Flow typing of styled component props doesn't work

问题描述

我有这个样式的组件:

type Props = {
  iconAlign: string,
};

const IconWrapper: ComponentType<Props> = styled.View`
  margin: 10px 10px 0px 10px;
  position: absolute;
  ${({ iconAlign }: Props) =>
    iconAlign === 'left' ? 'left: -35px;' : 'right: -35px;'}
`;

并这样称呼:

<IconWrapper iconAlign="left">

但是Flow给我以下错误:

but Flow gives me the following error:

Cannot call styled.View because property iconAlign is missing in object type [1] in the first argument of array element.

"flow-bin": "0.96.0",
"styled-components": "^4.2.0",
libdef: styled-components_v4.x.x (satisfies styled-components@4.2.0)

推荐答案

由于某些原因，目前似乎不支持内置组件上的自定义属性，但是Flow仍在开发对标记模板文字的支持. https://github.com/flow-typed/flow-typed上的讨论/pull/2933 对于理解为什么您的示例当前无法正常工作以及为使之成为可能而采取的步骤非常有用.

Looks like custom properties on a builtin component is not currently supported for a few reasons but namely Flow's still developing support for tagged template literals. The discussion at https://github.com/flow-typed/flow-typed/pull/2933 is quite useful for understanding why your example won't work currently and the steps being taken to make it possible.

这篇关于样式化的组件道具的流式输入不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！