javascript 如何在反应中迭代数组？

Posted 2021-05-03

import React from 'react'

const cpTable = (props) => {

  let trThead = null
  let trTbody = null

  if (props.data.rowContent){
    trThead = (
        props.data.rowContent.map( rowContent => {
          return (
            <tr>
              {
                Object.keys(rowContent).map(key => {
                  return <th>{rowContent[key]}</th>
                })
              }
            </tr>
          )
        })
    )
    trTbody = (
      <tr>
        <td>The table body</td>
      </tr>
    )
  }

  return (
    <div className="table-responsive">
      <h1>{props.data.title}</h1>  
      <table className="table table-striped table-bordered">
        <thead>
          {trThead}
        </thead>
        <tbody>
          {trTbody}
        </tbody>
      </table>
    </div>
  )
}

export default cpTable