文件列表:

backbone.router.flow.coffee (2695, 2014-04-22)
backbone.router.flow.js (4839, 2014-04-22)
bower.json (213, 2014-04-22)
test (0, 2014-04-22)
test\app_amd.coffee (1370, 2014-04-22)
test\app_amd.js (2058, 2014-04-22)
test\app_cjs.coffee (1199, 2014-04-22)
test\app_cjs.js (2110, 2014-04-22)
test\index.html (718, 2014-04-22)

backbone.router.flow ==================== SPAの構築を補助するシーン、遷移管理ライフラリ Installation ============ ``` ``` or bower ``` bower install backbone.router.flow ``` Example ======= Backbone.Routerをさっくり拡張してしまう(課題) Routerをextendする 例は require.js を使った場合。scriptタクて読み込んた場合冒頭のdefine不要。 ###app.coffee ``` define [ 'backbone' 'backbone.router.flow' 'scene/indexScene' 'scene/aboutScene' ], (Backbone, flow, indexScene, aboutScene) -> AppRouter = Backbone.Router.extend debug: false routes: '': indexScene 'about/': aboutScene 'about/:id': aboutScene firstTime: -> # 初回同期ロート時のみ処理 beforeEachEnter: (args) -> navView.setActive args indexScene.leave args # 下層への直リンク禁止 location.replace('#/') r = new AppRouter() Backbone.history.start root: "/" Backbone.router = r r ``` ###scene/indexScene.coffee ``` define [ 'jquery' 'backbone' ], ($, Backbone) -> IndexScene = Backbone.View.extend enter: (args)-> {prevUrl, url} = args @$el.fadeIn(2000).promise() leave: (args)-> {prevUrl, url} = args @$el.eq(1).fadeOut().promise() new IndexScene el: '.container' ``` ###scene/aboutScene.coffee ``` define [ 'jquery' 'backbone' 'scene/indexScene' ], ($, Backbone) -> AboutScene = Backbone.View.extend initialize: -> el: '.about' enter: (args)-> {prevUrl, url} = args @$el.fadeIn( 1000 ).promise() leave: (args)-> {prevUrl, url} = args @$el.hide().empty() new AboutScene ``` ##処理フロー * 1.「/」にアクセス * 2. indexSceneの「enter」メソットか呼ひ出される * 3. そのあと「/about」に遷移 * 4. indexSceneの「leave」か呼ひ出される * 5. fadeOutのフロミスを待つ * 6. aboutScene の「enter」か呼ひ出される コンソールにもろもろテハック出力か出る

近期下载者：

相关文件：

评论：[我要评论] [举报此文件]

收藏者：