对象键循环未在 React 中呈现

Question

不确定我的代码有什么问题，但是我无法获得一个简单的 div 来渲染它在对象键循环中。我知道它循环了 11 次，因为我已经将控制台日志放入其中并输出了 7 次 console.log，但是，div 根本不呈现。有任何想法吗：

class BookingView extends React.Component {
render () {
  const {color, booking} = this.props
  return (
    <div>
      <BookingHeader booking={booking} color={color}/>
      {Object.keys(booking).forEach(function(key,index) {
        <div>this is a test</div>
      })}
    </div>
  )
}
}

Answer 1

forEach不返回任何数组。使用map，而不是像这样

{Object.keys(booking).map(function(key,index) {
   return (<div key={key}>this is a test</div>)
})}

Answer 2

因为#array.forEach返回 undefined，用于#array.map从回调函数中返回自定义元素，最后map会返回所有元素的数组。

像这样写：

{
    Object.keys(booking).map((key,index)  => <div key={key}>this is a test</div>)
}

还添加key到每个动态生成的元素。