問題タブ [react-grid-layout]

ResponsiveReactGridLayout でコンポーネントを非表示にしようとしていますが、他のコンポーネントがそれを埋めないため、コンポーネントが非表示になり、空のスペースが作成されます。

コンポーネントにリンクされたチェックボックスが非表示にチェックされているかどうかを確認します。

サイズもゼロに設定しましたが、機能していません。

次の結果が得られます。

上記のリンクは、コンポーネントが非表示でない場合の表示に対応しています。 隠れない

これは問題に対応しており、空間が見えます。 コンポーネントの非表示

高さと幅を拡張できるようにしようとしてRDG Tableいます（拡張のために使用しました）。コンポーネント（私の場合はコンポーネント）に&を動的に提供するためにReactGridLayout使用しています。これで、テーブルのスクロールバーが一番上にあるときに、テーブルの高さと幅が正しく拡張されます。下の画像は、スクロールバーが上部にあるテーブルを示しています 。テーブルを 展開すると、下の画像のようにすべてが正しく機能します。 react-sizemeheightWidthExample

Scrollbar を中間に置いてからテーブルの高さを広げるとすぐに、行が消えます。これらの行は、テーブルを少しだけスクロールするとすぐに表示されます。たとえば、下の画像では、スクロールバーは最初にありません（行6が表示されています）。

テーブルを展開すると、下の画像に示すように、いくつかの行が消えます。

スクロールバーが最初にないときに、展開時に行が消える理由を理解できません。

CodeSandbox リンク: https://codesandbox.io/embed/rdg-optimising-scrolling-n6xpj

編集：テーブルには現在199行が含まれています。