javascript - React グリッドがレンダリングされない

Question

React では、https://github.com/STRML/react-grid-layoutを使用して基本的なグリッドを作成しようとしています。

2 つの長方形を作成し、次のようなレイアウトにしました。

<ReactGridLayout layout={{x:1, y:1, w:5, h:10}}>
  <div key={1} style={{width: "500px", height: "100px", border: "1px solid #000", bgcolor: "blue", color: "green"}}>
    Rectangle 1
  </div>

  <div key={2} style={{width: "500px", height: "100px", border: "1px solid #000", bgcolor: "blue", color: "green"}}>
    Rectangle 2
  </div>
</ReactGridLayout>

ただし、長方形の代わりに、これが表示されます。

この失敗の原因について何か考えはありますか?