2

私の App.Router は巨大な管理不能な単一のコード ブロックに変わります

App.Router = Em.Router.extend({

    // 100500 pages of horrible COPY-PASTE

    gotoBlabla: Ember.Route.transitionTo('blabla'),
    blabla: Em.Route.extend({
        route '/blabla',
        connectOutlets: function (router, context) {
            router.get('applicationController').connectOutlet('blabla');
    ...
    })
    ...
    ...

より冗長なスタイルで、コピーと貼り付けなしでルーティングを宣言する方法はありますか? Router 宣言を小さな独立した部分に分割する方法は?

4

1 に答える 1

3

ええ、絶対にあります。このアプリでは、各トップレベルルート（大まかに使用される用語）を独自のファイルで個別のクラスにします。これらのファイルが存在する「states」というディレクトリがあります。これにより、読みやすく、テストしやすくなることがわかりました。

例えば：

// file: states/blog_posts.js

App.BlogPostsState = Ember.Route.extend({
   route: '/posts',
   /* .... */
});

// file: states/search_results.js

App.SearchResultsState = Ember.Route.extend({
   route: '/search',
   /* .... */
});

// file: states/router.js

App.Router = Em.Router.extend({
   blogPosts: App.BlogPostsState.extend(),
   searchResults: App.SearchResultsState.extend(),
   /* .... */
});

どのコードが何度もコピーペーストされているのかわかりません。通常、それが起こっていることに気付いた場合、そのコードをミックスインに分離しようとしますが、特にルーター/ステートチャートでは、それは必ずしも簡単ではありません。

関連するかもしれないことの1つは、あなたが気付いているかどうかはわかりませんが、イベントは州の階層を上って移動するため、各リーフ状態は必ずしも同じイベント処理を再実装する必要はありません。

この例では、「showAlpha」と呼ばれる「アクション」または「イベントハンドラー」は、3つの状態/ルートの場所（アルファ、ベータ、デルタ）すべてで有効です。これにより、同じものを複数回再実装する必要がなくなります。

App.Router = Ember.Router.extend({
    showAlpha: Ember.State.transitionTo('alpha'),

    alpha: Em.Route.extend({
        route: '/alpha'
    }),
    beta: EM.Route.extend({
        route: '/beta'
    }),
    delta: Ember.Route.extend({
        route: '/delta'
    })
});

それがお役に立てば幸いです。それがあなたが何度も何度もコピーペーストしているコードをカバーしているかどうかはわかりません。

于 2012-07-25T12:24:31.967 に答える