Panel.Heading颜色变化

Question

我有这部分代码：

<Panel>
  <Panel.Heading>
    <Panel.Title toggle>
      Hello
    </Panel.Title>
  </Panel.Heading>
  <Panel.Collapse>
    <Panel.Body>
      Really wide body. Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
    </Panel.Body>
  </Panel.Collapse>
</Panel>

我希望更改Panel.Heading颜色，但是没有关于这个元素的文档。有人知道怎么做吗？提前感谢

Answer 1

要更改面板标题的颜色，可以设置Panel的Panel支柱，如下所示：

<Panel bsStyle="primary">
  <Panel.heading>
  ...

这将根据Bootstrap的颜色样式设置面板顶部的颜色。

可以用于bsStyle的值如下：

• default
• primary
• success
• info
• warning
• danger

下面是一个代码沙箱，它演示了这一点。

很难找到这方面的文档，因为react-bootstrap (和reactstrap)现在使用引导v4。Panel 是Bootstrap v3的一部分，但现在已被 Card.取代通过深入研究一些旧版本的react-bootstrap (特别是它们的bs3-dev 分支)，您可以查看当时的Panel。

您将注意到，在代码沙箱中，我们需要添加一些较旧版本的依赖项(bootstrap在3.4.1，react-bootstrap在0.32.1)。

希望这能有所帮助！

Answer 2

不熟悉反作用引导，但只是样式与css？或style={backgroundColor：“anyColor”}