reactjs - JSX 仅映射数组中的第一个对象

Question

我很好奇如何在 JSX 中使用 .map 只渲染数组中的第一个对象。

{this.state.data.map(data =>
    <span className="fooBar">
        <a href={data.foo}>{data.bar}</a>
    </span>
)}

谢谢!

Answer 1

最简单的解决方案是根本不使用 .map!

<span className="fooBar">
    <a href={this.state.data[0].foo}>{this.state.data[0].bar}</a>
</span>

.map 将始终遍历数组中的每个对象 - 无法尽早摆脱它。