2

私はバックボーンが初めてで、ビューの内容を再レンダリングしようとしています。コードをjsfiddleに入れました...

http://jsfiddle.net/rzYLU/11/

ユーザーが再レンダリングをクリックすると、dom のコンテンツを削除して新しいアイテムのみを表示するにはどうすればよいですか?

4

1 に答える 1

4

QuestionView最も安全なのは、インスタンスを .xml 内で追跡することですAppView。次に、新しいものを追加する前removeにそれぞれを呼び出すことができます。メソッドは次のQuestionViewとおりです。remove

DOM からビューを削除するための便利な関数。$(view.el).remove();を呼び出すのと同じです。

removeビューは、非 DOM イベントからバインドを解除してゾンビを防ぐ独自の実装を提供する必要があります。デフォルトでは単にビューelを DOM から削除しますが、最初からこれを行うと、コードが必然的に変更された場合でも問題なく動作し続けます。

最初に、モデルにバインドしたイベントを削除するメソッドをQuestionView持つように調整します。remove

var QuestionView = Backbone.View.extend({
    //...
    remove: function() {
        this.model.off('change', this.render);
        this.$el.remove();
    }
});

次に、 をAppView追跡するためにいくつかの調整が必要になりますQuestionView。

var AppView = Backbone.View.extend({
    //...
    initialize: function() {
        //...
        this.sub_views = [ ];
        //...
    },
    //...
    addOne: function(question) {
        var view = new QuestionView({
            model: question
        });
        this.sub_views.push(view); // <----------------------- Add this
        this.$("#question-list").append(view.render().el);
    },
    addAll: function() {
        for(var i = 0; i < this.sub_views.length; ++i) // <--- And these three lines
            this.sub_views[i].remove();
        this.sub_views = [ ];
        Questions.each(this.addOne);
    }

デモ: http://jsfiddle.net/ambiguous/FF9eG/

また、新しいスタイルに合わせてonandoffの代わりにbindandを使用するようにコードを更新しました。unbindBackbone の新しいバージョンには、キャッシュされたバージョンの$(this.el)inもあるので、this.$elそれを使用するようにコードを更新しました。

于 2012-10-07T18:00:42.493 に答える