Question

我扩展了todomvc的Backbone版本，我发现这些观点非常善变。很难让听众和事件消除歧义。无法理解为什么这会调用app.AppView.render()两次渲染，而在第二次调用时会删除本地存储中的项目。任何人都有本地骨干存储的问题？

搜索输入存储第一个项目，然后重新加载并且集合为空。

Html视图：

app.AppView = Backbone.View.extend({
    el: '#searchapp',
    events: {
        'keypress #new-search': 'createOnEnter',
        'click #clear-unstarred': 'clearUnStarred',
    },
    initialize: function () {
        this.$input = this.$('#new-search');
        this.$list = $('#search-list');
        this.$results = this.$('#search-grids');
        this.$stats = this.$('#search-stats');

        this.listenTo(app.searches, 'add', this.addOne);
        this.listenTo(app.searches, 'reset', this.addAll);
        this.listenTo(app.searches, 'change:starred', this.filterOne);
        this.listenTo(app.searches, 'filter', this.filterAll);
        this.listenTo(app.searches, 'all', this.render);

        app.searches.fetch(); //{reset: true}
    },

    render: function () {
        //app.SearchFilter = app.SearchFilter || 'starred';
        var starred = app.searches.starred().length;
        var remaining = app.searches.remaining().length;
        if (app.searches.length) {

            var h = $('#stats-template').html(), t = _.template(h),
                d = {
                    count: (starred + remaining),
                    starred: starred,
                    remaining: remaining
                }, s = t(d);

            this.$stats.html(s);
            this.$('#filters a').removeClass('selected').filter('[href="#/' + (app.SearchFilter || '') + '"]').addClass('selected');
            app.searches.last().trigger('runsearch');

        } else {
            //this.$results.hide();
            //this.$stats.hide();
        }

    }, ...............

项目视图：

app.SearchView = Backbone.View.extend({
    tagName:  'div',

    events: {
        'click .do-search': 'runSearch',
        'click .do-destroy': 'clear',
        'click .do-toggle-star': 'togglestar',
        'dblclick label': 'edit',
        'keypress input.title': 'updateOnEnter',
        'keydown input.title': 'revertOnEscape',
        'blur input.title': 'close'
    },

    initialize: function () {
        this.$results = $('#search-grids');
        this.listenTo(this.model, 'change', this.render);
        this.listenTo(this.model, 'destroy', this.remove);
        this.listenTo(this.model, 'visible', this.toggleVisible);
        this.listenTo(this.model, 'runsearch', this.runSearch);
    },

    render: function () {
        if (this.model.changed.id !== undefined) {
            return;
        }
        var h = $('#search-item-template').html(), t = _.template(h),
            d = this.model.toJSON(), s = t(d);
        this.$el.html(s);
        this.$el.toggleClass('starred', this.model.get('starred'));
        this.$input = this.$('input.title');
        this.toggleVisible();
        return this;
    },

`

Answer 1

Chrome开发者工具未显示＆＃34;存储＆＃34;在发行期间。清理确实有帮助。避风港发生了重大变化。基本上确保在这里进行集合add（）和模型save（） -

http://www.mostlystatic.com/2013/01/26/minimal-backbone-localstorage-example.html

Backbone.Js app重新加载，调用渲染两次

1 个答案: