Extjs 그리드 panel_extjs의 내장 스크롤 막대 오류에 대한 솔루션

이전에 EXTJS GridPanel 컴포넌트를 사용할 때는 GridPanel의 스트로브 데이터가 필터링되는 경우가 많았기 때문에 GridPanel 자체의 스크롤바가 작동하지 않는 경우가 있었습니다.

예를 들어 EXTJS GridPanel과 함께 제공되는 스크롤 막대에는 위 그림과 같이 스크롤 막대를 배치할 수 있는 고정된 열 너비가 있습니다. 따라서 스크롤 막대가 실패하면 스크롤 막대를 어떻게 드래그하더라도 그리드의 데이터는 스크롤 막대가 움직일 때 해당 영역의 데이터를 표시하지 않습니다(즉, 항상 표시되는 데이터는 스크린샷에 있음). 기록).

그리드 패널이 실패하는 이유는 무엇입니까? 이유가 무엇인지는 아직 명확하지 않습니다. 어떤 사람들은 이전에 Extjs 포럼과 stackoverflow에서 비슷한 문제를 겪었지만 버전이 4.1 이전일 수 있습니다. Extjs 개발팀은 버전 4.1부터 이 문제를 해결했다고 말했습니다(확실하지는 않습니다. 버전 4.1을 사용했으면 좋겠습니다). 신발 인수(인수 아래).

자, 이제 스크롤바 오류 문제를 해결하는 방법에 대해 이야기해 보겠습니다.

xtype: 'gridpanel',
// autoScroll:true,
scroll:false, 
viewConfig: {
style: { overflow: 'auto', overflowX: 'hidden' }
}

보시다시피 autoScroll 속성이 비활성화되고, 스크롤이 false로 설정되고, viewConfig가 설정됩니다. 여기서는 가로 스크롤바가 비활성화되고 세로 스크롤바만 유지됩니다. 문제가 해결되었습니다. 효과를 확인하세요.

이제 스크롤 막대는 더 이상 자체 열을 갖지 않고 그리드의 마지막 열과 병합됩니다. 이런 방식으로 GridPanel과 함께 제공되는 스크롤 막대가 비활성화됩니다.

이 잠재적인 버그도 해결되었습니다.

그러나 이 용도에서는 그리드의 모든 열에 대해 고정 너비를 설정하고 속성을 설정하는 것이 가장 좋습니다.

resizable:false

이렇게 하면 가로 스크롤 막대를 비활성화하여 발생하는 불필요한 문제를 피할 수 있습니다.