尝试构造一个组件,该组件根据属性返回几个不同样式的组件。下面是我得到的信息:
const Type = ({ props }) => {
const { right, center } = props;
switch (props) {
case props.paragraph:
return <StyledParagraph right={right} center={center} {...props} />;
case props.h1:
return <StyledHeadingOne right={right} center={center} {...props} />;
case props.h2:
return <StyledHeadingTwo right={right} center={center} {...props} />;
case props.h3:
return <StyledHeadingThree right={right} center={center} {...props} />;
case props.h4:
return <StyledHeadingFour right={right} center={center} {...props} />;
case props.h5:
return <StyledHeadingFive right={right} center={center} {...props} />;
case props.h6:
return <StyledHeadingSix right={right} center={center} {...props} />;
default:
return <SetTypeError right={right} center={center} {...props} />;
}
};
它的回归是,道具是不确定的。我像这样调用组件:
发布于 2019-03-08 05:11:47
通过编写({ props })
,您可以从作为组件的第一个参数的props对象中析构props
属性,这相当于以下内容:
const Type = (param) => {
const props = param.props;
const { right, center } = props;
// ...
};
只需编写(props)
,将props对象命名为props
,它就会像预期的那样工作。
const Type = (props) => {
const { right, center } = props;
// ...
};
https://stackoverflow.com/questions/55052771
复制相似问题