时间戳

首页 > 解决方案 > 反应中样式化组件的类型

react-redux - 反应中样式化组件的类型

问题描述

我在我的项目中使用样式组件。并有这个组件

const Title = styled.h1`
  font-size: 1.5em;
  text-align: center;
  color: #000;
`;

而且我不知道我需要为这个组件添加什么类型标题：React$ComponentType< any> 工作，但我认为放任何都是坏主意。

我搜索我的问题并找到这个

type StyleValue = {[key: string]: Object} | number | false | null;
type StyleProp = StyleValue | Array<StyleValue>;

但它适用于本机反应，我无法为我的项目更新它

标签： react-reduxflowtypestyled-components

解决方案

我不确定你在问什么，但我会举一个例子，希望它能帮助你理解。请提供更多信息。下面我有我的Title组件

const Title = ({
  text,
  textColor,
}) => {
  return (
    <StyledTitle textColor={color}>
      {text}
    </StyledTitle>
  );
};

Title.propTypes = {
  text: PropTypes.string,
  textColor: PropTypes.string,
};

export default Title;

使用Styled-components我然后有我的StyledTitle.js文件：

const StyledTitle = styled.h1`
  color: `${props => props.textColor} || black`;
  font-size: 1.5em;
  text-align: center;
`;

export default StyledTitle;

希望这对您有所帮助。

推荐阅读