2

単一ページのサイトに BackboneJS を使用したいと考えています。私が使用することを考えている構造は、div#pageWrapperビューをロードするためのものです

# a simple example view
class View1 extends Backbone.View
    render: ->
        @$el.html @template()


class AppRouter extends Backbone.Router
    routes:
        "": "home"
        "view1": "view1"
        "view2": "view2"

    home: ->
        # init, render, attach to body. repeat for other controller actions
        view = new HomeView()
        view.render()
        $("#pageWrapper").html view.el

これを行う通常の方法はありますか?それとも、すでに利用可能な何らかのデザインパターンがありますか? クリーンアップを処理していませんが、必要ですか? それとも、単にページ ラッパーの html を置き換えることの副作用ですか?

4

2 に答える 2

3

はい、ビューのクローズと削除を適切に処理する必要があります。そうしないと、メモリリークと「ゾンビ」ビューが発生します。ビューは死んでいるはずですが、そうではありません。

私はそれについて広範囲に書いています:

http://lostechies.com/derickbailey/2011/09/15/zombies-run-managing-page-transitions-in-backbone-apps/

http://lostechies.com/derickbailey/2011/12/12/composite-js-apps-regions-and-region-managers/

その要点は、ビュー内のビューのクリーンアップを直接管理してから、標準化されたプロセスを使用してビューのクリーンアップメソッドを呼び出す必要があるということです。

たとえば、オブジェクトを使用して、画面上のビューを表示/削除/置換します。


Region = (function (Backbone, $) {
    var currentView;
    var el = "#mainregion";
    var region = {};

    var closeView = function (view) {
        if (view && view.close) {
            view.close();
        }
    };

    var openView = function (view) {
        view.render();
        $(el).html(view.el);
        if (view.onShow) {
            view.onShow();
        }
    };

    region.show = function (view) {
        closeView(currentView);
        currentView = view;
        openView(currentView);
    };

    return region;
})(Backbone, jQuery);

ビューにcloseメソッドが含まれていることを確認してください。このコードでクリーンアップされます。単純なclose実装は次のようになります。


Backbone.View.prototype.close = function(){
  this.remove();
  this.unbind();
  if (this.onClose){
    this.onClose();
  }
}

そして今、あなたのすべてのビューはこのcloseメソッドを持っています。

詳細については、記事を参照してください。

于 2012-06-13T14:45:30.940 に答える
0

はい、単一ページのサイトを実行する通常の方法は、任意の時点で表示されるページをレンダリングする html 要素を用意することです。

クリーンアップについて。コンテナー要素をクリアし、クリーンアップする各ビュー内で、そのビューに関するすべてのイベントをバインド解除する必要があります。たとえば、ModelBinding を使用している場合は、それもバインド解除する必要があります。だから基本的に

すべてのサブビューをクリーンアップ -> このビューに関するイベントのバインドを解除 -> html をクリア

クリーンアップを処理することは、ゴースト ビューやイベントによって混乱が生じるのを避けるために重要です。

于 2012-06-13T14:42:13.790 に答える