Question

我想我需要使用tag参数为Jumbotron分配道具，但我不理解reactstrap组件页面上给出的语法。

    Jumbotron.propTypes = {
    // Pass in a Component to override default element
    tag: PropTypes.oneOfType([PropTypes.func, PropTypes.string]),
    fluid: PropTypes.bool,
    className: PropTypes.string
    };

我的工作代码是

    return (
       <div>
       <Container>
       <Jumbotron >
          <h1 className="display-3">{this.props.title}</h1>

我试图将支柱传回Jumbotron以改变它的高度，并从调用组件动态更改背景图像。有没有人有一个链接，可以帮助我到底？如果不对代码片段感到失望，那将非常感激。

提前致谢。

Answer 1

您可以照常将style传递到<Jumbotron>。例如：

<Jumbotron style={{ backgroundColor: 'red', height: 200 }}>
  <h1 className="display-3">hey</h1>
</Jumbotron>

有一个例子here。

Answer 2

最终代码需要一个require（）来提供指向jumbotron背景图像的正确指针。 require不能在组件本身中，因为在组件级别将props传递给require会产生webpack错误。相反，require（）必须在调用组件中，因为参数必须是纯字符串。组件和调用元素的最终代码如下。

Click here to show the complete reactstrap Jumbotron component with props

Click here to see the calling element configuration

在reactstrap中，如何从调用组件获取参数到Jumbotron？

2 个答案: