ホームページ  >  記事  >  ウェブフロントエンド  >  Extjsグリッドpanel_extjsの組み込みスクロールバーの不具合の解決策

Extjsグリッドpanel_extjsの組み込みスクロールバーの不具合の解決策

WBOY
WBOYオリジナル
2016-05-16 16:36:291291ブラウズ

以前 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 属性が無効になり、scroll が false に設定され、次に viewConfig が設定されます。ここでは、水平スクロール バーが無効になり、垂直スクロール バーのみが保持されます。 OK、問題は解決しました。効果を確認してください:

この時点で、スクロール バーには独自の列がなくなり、gridPanel に付属のスクロールバーが無効になっていることがわかります。

この潜在的なバグも解決されています。

ただし、この使用法では、グリッド内のすべての列に固定幅を設定し、属性を設定するのが最善です。

resizable:false

これにより、水平スクロール バーを無効にすることによって引き起こされる不要なトラブルを回避できます。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。