Gridstack.js: 전체 상위 높이를 취하는 중첩 그리드 지원(열과 마찬가지로 % 행 시뮬레이션)

중첩된 그리드를 사용하여 다른 그리드 내에서 불투명한 위젯으로 사용할 수 있는 촘촘한 위젯 그룹인 복합 위젯을 만들고 있습니다(단위로 이동, 별도로 편집됨). 빨기 때문에 부모 gridItem이 제공하는 전체 공간(너비와 높이)을 취하기 위해 중첩 그리드가 필요합니다. 여기에는 사용자가 크기를 조정할 수 있는 휴리스틱이 있습니다.

이상적으로는 grid.cellHeight = 'dynamic' 가 전체 너비(% 기반 크기 조정)를 사용하는 열과 함께 오늘날 사용하는 것과 유사하게 부모의 전체 높이를 취하는 것을 의미합니다. 새 항목을 추가하면 항목을 드래그/배치할 때 일시적으로 새 행이 생성되지만(내용이 맞지 않을 때 스크롤 V 막대 생성), 놓을 때 크기에 맞게 크기가 조정됩니다(셀 높이를 맞춤, 동일한 행# 유지 및 전체적으로 유지). 형세)

지금은 옆에서 해킹을 시도하고 있습니다. 아직 가장 간단한 부분은 작동하지 않습니다!

귀하의 환경

v 0.3.0 및 최신 1.0.0-dev는 약간 다른 동작을 보여줍니다(

재현 단계

1) https://jsfiddle.net/cLdzzL8p/2/
항목 크기 조정을 처리하는 추가 코드가 있는 demo/nested.html의 복사본입니다.
$('#그리드').on('gsresizestop')
2) 오른쪽(중첩) 그리드 항목의 크기를 조정하거나 이벤트를 트리거하기 위해 더 넓게 만듭니다.
3) oldCellHeight = 60px는 더 큰 숫자로 이동해야 합니다(동일한 300pix gridItem의 경우 140px).

예상되는 행동

부모의 전체 높이를 취하는 중첩 그리드(동적으로 변경됨)

실제 행동

v0.3.0(그리드스터 샘플)에서 그리드가 성장하고 전체 높이를 차지하여 셀도 더 커지도록 강제하지만 모든 형제 gridItems도 성장합니다(잘못된 공유 리소스이거나 $() 검색이 중첩 그리드의 자식으로 필터링됩니다.

1.0.0-dev(내가 사용하는 것)에서 GridStack.prototype._updateStyles()가 더 일찍 이동된 이 코드 줄로 인해 일찍 반환되는 것으로 나타납니다.

if (this._styles._max !== 0 && maxHeight <= this._styles._max) { 반환; } // this._styles._max를 계속 증가시킵니다.

내가 이해하지 못하는 https://github.com/gridstack/gridstack.js/commit/a38d78eebe59686a6ffea1b802791ac39e15de2d 를 참조하십시오. #766도