React组件中的Switch语句
React组件中的Switch语句
提问于 2019-03-08 05:05:19
尝试构造一个组件，该组件根据属性返回几个不同样式的组件。下面是我得到的信息：
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} />;
}
};它的回归是，道具是不确定的。我像这样调用组件：
回答 1
Stack Overflow用户
回答已采纳
发布于 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;
// ...
};页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/55052771
复制相关文章
相似问题
腾讯云开发者
