javascript - 使用 map 函数渲染表体

Question

我是 react 的新手。 这里我有一个数组中的数据。现在我想渲染那个表数据。使用 map 函数，我尝试的是，

    <tbody>
                { this.props.jobList.length > 0 &&  this.props.jobList.content.map(function (item, key) {
                  return (
                    <tr key={key}>
                      <td>1</td>
                      <td>2</td>
                      <td>3</td>
                      <td>4</td>
                      <td>5</td>
                      <td>6</td>
                      <td>7</td>
                    </tr>
                  )
                })}
</tbody>

{
    "content": [{
        "id": "5b7d4a566c5fd00507501051",
        "hrmsJdId": null,
        "companyId": null}]
}

在这里，我在 jobList 中确实有数据，但它仍然没有呈现 td 内容。谁能解释一下我该怎么做？或者我哪里做错了？

Answer 1

您应该映射数组数据 (this.props.jobList) 而不是对象。 render 应该是这样的:

<tbody>
    {this.props.jobList && this.props.jobList.content && this.props.jobList.content.length > 0 && this.props.jobList.content.map((item, key) => {
        return (
            <tr key={key}>
                <td>1</td>
                <td>2</td>
                <td>3</td>
                <td>4</td>
                <td>5</td>
                <td>6</td>
                <td>7</td>
            </tr>
        )
    })}
</tbody>