7

Mongo データベースは、ネストされたデータを含む配列を返す可能性があります。{applications: {data: {description: 'My description}}} に含まれるデータを表示したい

しかし、それはまったく機能しません。どうすればよいか、アイデアはありますか?ドキュメントにもSOにも何も見つかりませんでした。

const Applications = (props) => (
  <div className="applications">
    {props.applications.length === 0 ?
      <div>Aucune candidature</div>
      : <BootstrapTable data={props.applications} striped={true} hover={true}>
        <TableHeaderColumn dataField="_id" isKey={true} dataAlign="center" dataSort={true}>Title</TableHeaderColumn>
        <TableHeaderColumn dataField="status">Candidat</TableHeaderColumn>
        <TableHeaderColumn dataField="data.description" dataSort={true}>description</TableHeaderColumn>
      </BootstrapTable>
    }
  </div>
)

ご協力ありがとう御座います ;）

4

3 に答える 3

12

数分後、解決策が見つかりました: ドキュメントのこの部分に示されているように、カスタム dataFormatter を使用する必要がありました: https://github.com/AllenFang/react-bootstrap-table#quick-demo

オブジェクトをセルに渡し、フォーマッタを使用して必要なデータを抽出するだけです

だから、ここに私の最終的なコードがあります：

function showDescription(cell, row) {
  return cell.description;
}

const Applications = (props) => (
  <div className="applications">
    {props.applications.length === 0 ?
      <div>Aucune candidature</div>
      : <BootstrapTable data={props.applications} striped={true} hover={true}>
        <TableHeaderColumn dataField="_id" isKey={true} dataAlign="center" dataSort={true}>Title</TableHeaderColumn>
        <TableHeaderColumn dataField="status">Candidat</TableHeaderColumn>
        <TableHeaderColumn dataField="data" dataSort={true} dataFormat={showDescription}>description</TableHeaderColumn>
      </BootstrapTable>
    }
  </div>
)

于 2016-06-17T15:05:41.053 に答える