初心者のためのExtJS入門スマートフォン用の表示で見る初心者のためのExtJS入門ExtJSを使うので、ついでにまとめていきます2017-01-17チュートリアル:ルーティングを使って、SPA(シングルページアプリケーション)にする(1)ExtJS今回は、メモ一覧とメモ入力フォームを別の画面に分けて、ルーティングを使って画面遷移できるようにします。ルーティングは、URLのパターンで処理を切り替える機能です。これを使ってSPAにします。最終的には、http://localhost:1841/#listにアクセスした場合は一覧画面、http://localhost:1841/#registにアクセスした場合は登録画面を表示するようにしようと思います。ビューコントローラのroutesコンフィグでルートを定義するとりあえず、まずルーティングを試してみます。ルーティングはどのビューコントローラにでも設定できますが、ここでは全体を構成するビューポートのビューコントローラに定義することにしましょう。ビューポートとそのビューコントローラクラスだけ用意します。ビューポートのビューコントローラクラス。}});http://localhost:1841/#listにアクセスすると、コンソールログ#listが出力されました。このように、ビューコントローラのroutesコンフィグにURLのパターンをキーとして設定したメソッドが呼ばれていることが分かります。画面を表示してみる次は具体的に画面を表示してみます。一覧画面と登録画面をそれぞれMemo.view.list.Panel、Memo.view.regist.Panelとして作成してみます。ビューモデルとビューコントローラの部分は一旦外してシンプルな状態にしておきます。sassも変更に合わせて調整が必要です。メモ一覧パネルクラス。メモ一覧データビュークラス。メモ登録フォームパネルクラス。recordコンフィグ設定時の処理。}});次に画面は動的に作成し、ビューポートに設置させるようにしてみます。ビューポートのビューコントローラクラス。}});これでhttp://localhost:1841/#list、http://localhost:1841/#registにアクセスしたら、一覧画面と登録画面が表示されるようになりました。次回、もう少し細かい部分の実装をしてみます。23:46チュートリアル:ルーティングを使って、SPA(シングルページアプリケーション)にする(1)Tweet広告を非表示にする関連記事2017-01-25チュートリアル:ルーティングを使って、SPA(シングルページアプリケーション)にする(modern)今回は、SPA対応のmodern版です。classicとほとんど同じ...2017-01-22チュートリアル:一覧画面を作成する(modern)これからclassicで作った画面の、modern版を作成していきます。...2017-01-18チュートリアル:ルーティングを使って、SPA(シングルページアプリケーション)にする(2)今回はSPAの続きです。ルーティングで画面を切り替える部分は...2017-01-15チュートリアル:ビューモデルを使って、フォームパネルを編集に対応させる今回は、保存しているメモを編集できるようにしたい、という内...2017-01-12チュートリアル:スタイルを整える現在の画面は↓なかんじになっているわけですが。(2)ツリーパネル[modern]任意のコンフィグを双方向バインディングに対応するスポットライト[classic]Googleマップアイコンフォントアイコンフォントのパッケージ作成suspendLayouts・resumeLayoutsES6で書いてみるExt.Deferredで非同期処理をまとめるビューモデルのデータにモデルを設定して使用するプラグインの作り方ミックスインの作り方ボタンのUIにバインディングできるように工夫するはてなブログをはじめよう!sham-memoさんは、はてなブログを使っています。ブログを報告するスターをつけました引用をストックしましたストック一覧を見る閉じる引用するにはまずログインしてくださいログイン閉じる引用をストックできませんでした。再度お試しください閉じる限定公開記事のため引用できません。