ライブラリ react-grid-layout で問題が発生しましたが、それがバグなのか、私のやり方が悪いのかわかりません。ここで問題を提起しましたが、考えれば考えるほど、これほど大きな問題が見過ごされている可能性は低くなります。ここで私が経験していることのデモを見つけることができます

私がやろうとしていること

react-grid-layout を使用してダッシュボードを作成したいと思います。私は コンテナパターンを実装しようとしているので、彼の状態を介してレイアウトを制御し、このレイアウトを小道具のダッシュボードコンポーネントに渡すDashboardContainerコンポーネントがあります。

私が遭遇する問題

初期状態では要素が正しく配置されていますが、アイテムを追加すると、追加された要素の x、y、w、および h が正しくありません。最初の加算では (5,0,2,2) である必要があり、最終的に (0,4,1,1) に配置されますt は正しいキーを持っていますが、私のキーは正しいと思います。

例: このレイアウトはダッシュボードレイアウト データに渡されます

しかし、これは表示されたレイアウトです (要素「new0」は対応していません) 表示されたレイアウト

私のコード

これが私のDashboardContainerコンポーネントの（簡略化された）コードです

そして、ダッシュボード コンポーネント:

完全な (ほぼ) 動作するコードは、このコードサンドボックスにあります。

私は React と RGL にまだ慣れていないので、どんな提案も歓迎します!

ありがとうございました