2

パネルがReactクラスであるブートストラップアコーディオンを実行しようとしています。どういうわけかこれはうまくいきません：

<ReactBootstrap.Accordion>
   <WontWorkPanel pkey={1} />
   <WontWorkPanel pkey={2} />
</ReactBootstrap.Accordion>

http://jsfiddle.net/3azxcquh/

キーを使用して単一のWontWorkPanelパネルをレンダリングする React クラスですthis.props.pkey。

誰かが私が間違っていること、またはそれを改善する方法を説明してもらえますか?

ありがとう！

4

1 に答える 1

3

アコーディオンはその子を新しい小道具で複製し、それらの小道具はPanelコンポーネントの表示/非表示を制御します。カスタムラッパーで引き続き機能させるには、小道具をラッパーから子Panelに転送する必要があります。Panel

フィドル: http://jsfiddle.net/ssorallen/3azxcquh/6/

var WontWorkPanel = React.createClass({
  render: function() {
    return this.transferPropsTo( 
      <ReactBootstrap.Panel header={"WontWork " + this.props.key} key={this.props.key}>
        Anim pariatur cliche reprehenderit, enim eiusmod high life
        accusamus terry richardson ad squid. 3 wolf moon officia aute,
        non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt
        laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua pu
      </ReactBootstrap.Panel>
    );
  }
});
于 2014-09-22T06:16:40.573 に答える