0

我有一个奇怪的问题，当我转到页面时没有显示视图。但是，如果我刷新页面，它会出现。

在我的路由器中，我尝试渲染 2 个视图，如下所示：

tags: function(tags) {
        self = this;
        self.multipleTags = tags.split('/');
        self.tagsArray = $.grep(self.multipleTags, function(item,index) {
            return (item != '');
        });
        var browseHeader = new BrowseHeader;
        var content = new tagsView({query:self.tagsArray});
    },

虽然我的 BrowseHeader 有问题，但 tagsView 工作正常。我确实尝试删除我的 tagsView以查看它们是否存在冲突。但是，即使使用单个视图渲染，在我刷新页面之前，标题仍然不会显示。

这是我在 BrowseHeader 视图中所做的事情：

var browseHeader = Backbone.View.extend({
    initialize: function() {
        this.render();
    },
    template: function() {
        dust.render('dust/browseHeader','', function(error, output) {
            $('#wrapper').append(output);
        });
    },
    render: function() {
        this.template();
    },
    el: '#wrapper',
    events: {
        'click .academy_filter' : "click_filter"
    },
    click_filter: function(event) {
        target = event.target;
        $('.academy_filter').removeClass('active');
        $(target).addClass('active');
        EventBus.trigger('header:click_filter', target);
    }
});

当我 console.log 输出时，它确实显示了输出的 html，尽管它没有显示在页面上。所以我知道我的灰尘模板正在工作。当我将 BrowseHeader 渲染函数简化为 $('#wrapper').append("this"); 我仍然遇到同样的问题。

有任何想法吗？

更新：显然它与浏览器和 pushState 有关，因为当我将路由器更改为以下时，它工作正常。

Backbone.history.start({pushState: true});

4

1 回答 1

0

据我所知，你的观点没有错。这很可能是时间问题。#wrapper您的视图可能在 DOM 中存在之前已被初始化（并因此被渲染） 。我的猜测是，如果您尝试以下操作，输出将是0：

dust.render('dust/browseHeader','', function(error, output) {
  console.log($('#wrapper').length);
  $('#wrapper').append(output);
});

确保在 DOM 完成加载后创建视图，如下所示：

$(document).ready(function() {
  var header = new browseHeader();
});
于 2013-08-31T20:35:08.763 回答