おそらくビューポートを使用し、中央領域をコンテナにしたいと思うでしょう。
センター リージョン コンテナは、通常、カードまたはタブ レイアウトを持ちます。
ユーザーが新しいビュー (コンポーネント) に移動したら、そのビューをコンテナーに追加してアクティブにします。
大きな間違いは、最初に URL を変更することです。あなたはそれをしたくありません。
ナビゲートして、ナビゲートが成功した場合は URL を設定します。ExtJS の History コンポーネントは正しく実装されていないため、おそらく使用しないでください。HTML5 pushState を使用することをお勧めします。
URL バーも変更せずに、ナビゲーション システムが機能することを確認する必要があります。
Microsoft Prism、WPF、Silverlight のナビゲーションに関するドキュメントが他にもあるので、それを読んで ExtJS に適用することをお勧めします。
http://msdn.microsoft.com/en-us/library/gg430881(v=pandp.40).aspx
ナビゲーション プロセスの例を次に示します。
navigationContext = {
fragment: 'contacts/5',
xtype: 'contacts-form',
parameters:{
id: 5
}
}
オプション: フォームを使用する場合:
終了オプション
- 簡単な方法は、新しい
widget
を作成しnavigationContext.xtype
、それをナビゲーション領域に追加してから、 を呼び出すことsetActiveItem(widget)
です。以前のアクティブなアイテムが存在する場合は破棄します。
それから電話するhistory.pushState(null, null, navigationContext.fragment)
次に、ビューで「navigatedto」イベントを発生させ、コンテキストを渡すと、そこからデータをロードできます。
より高度なシナリオは次のとおりです。
元のコンポーネントに戻ることが予想される場合は、前のコンポーネントを存続させます。keepAlive プロパティを追加し、true の場合、新しいコンポーネントをコンテナーに追加するときに破棄しません。
コンテナーを検索し、現在のナビゲーション リクエストを処理するかどうかを各コンポーネントに問い合わせます (たとえば、contact-5 で読み込まれたフォームがナビゲーション領域で既に非表示になっている場合、またはフォームを再利用する場合)。