ウィンドウの変更に応じてグリッドが自動的に調整できないのはなぜかとよく尋ねられます。それを理解した後、多くの人はサブコンポーネントをレンダリングするときにグリッドをコンテナー内の div にレンダリングすることに慣れており、まさにそこに問題があることがわかりました。
Ext JS のレイアウトシステムでは、制御できるのはコンテナのサブコンポーネントですが、コンテナ内の DIV にレンダリングされた Grid については、Grid が追加されたことを知りません。サイズを変更する場合、グリッドのサイズを調整することはできません。これが、コンテナが変更されてもグリッドが変更されない理由です。
なぜこれほど多くの人がこの方法を使ってサブコンポーネントを追加することを好むのでしょうか? 主な理由は 2 つあると思います:
1. コンテナーにサブコンポーネントを追加する方法がわかりません。
2. 他のフレームワークを使用する開発方法に慣れています。
最初の理由は、Grid が動的に追加される限り、多くの初心者が戸惑うことです。たとえば、私の Grid は事前にリモートから返す必要があります。作成方法はわかっていますが、このスクリプトを取得してコンテナに追加するにはどうすればよいですか?著者も Ext JS を学習する際にこの間違いを犯しましたが、これは当然のことです。したがって、この記事の目的は混乱を解消することです。
方法は 2 つあります。まず、Ajax を使用してグリッド全体 (または他のコンポーネント構成オブジェクト) をローカルにロードし、次にコンテナーの add メソッドを使用してコンポーネントを; 1 つは、コンテナーのロード関数を直接使用して、サブコンポーネントを直接ロードし、それをレンダリングする方法です。
2 番目の理由は習慣の問題です。これは自分でしか修正できません。できるだけ早く Ext JS 開発モデルに慣れることで、この習慣を簡単に変えることができます。
Ext JS 4 の MVC を使用して開発する場合は、基本的にこのような厄介な状況は発生しません。そのため、サブコンポーネントをビューにして、そのビューをコントローラーのコンテナーに追加することができます。