javascript - React-bootstrap アコーディオンが正しく機能しない

Question

私は反応を学ぼうとしています。試しに、私は react-bootstrap を試していて、react-bootstrap アコーディオンを使用してアコーディオンを実装しようとしていました。最初に ButtonToolBar を使用してみましたが、うまくいきました。

var ButtonToolbar = ReactBootstrap.ButtonToolbar;
var Button = ReactBootstrap.Button;
var buttonsInstance = (
    <ButtonToolbar>
      <Button>Submit</Button>
      <Button>Cancel</Button>
    </ButtonToolbar>
);

React.renderComponent(
    buttonsInstance,
    document.getElementById('app')
);

しかし、react-bootstrap のアコーディオン コードが機能しませんでした。内容を表示していましたが、アコーディオンの場合とは異なります。コードは次のとおりです。

var Accordion = ReactBootstrap.Accordion;
var Panel = ReactBootstrap.Panel;

var accordionInstance = (
    <Accordion>
      <Panel header="Collapsible Group Item #1" key={1}>
        Content1
      </Panel>
      <Panel header="Collapsible Group Item #2" key={2}>
        Content2
      </Panel>
      <Panel header="Collapsible Group Item #3" key={3}>
        Content3
      </Panel>
    </Accordion>
);

React.renderComponent(
    accordionInstance,
    document.getElementById('app')
);

も使用してみましたが、同じように動作しました。私はここから助けを求めていました。

ここに同様の質問があります。しかし、私の場合、ReactBootstrp.Panel をカスタマイズしないと動作しません。

任意のアイデア、どうすれば機能させることができますか?