每当我在浏览器中按下后退按钮时,视图都是空的,并且出现如下错误:
我真的不知道我应该在此处放置应用程序的哪个部分来解决问题,但没有一个错误涉及我的代码的一部分..
有趣的是,如果我按下前按钮并再次按下后按钮,一切都会完美呈现,并且错误不再存在。
我的路由器和视图如下所示:
var AppRouter = Backbone.Router.extend({
initialize: function() {
this.model = new model();
this.collection = new collection();
},
routes: {
"": "showForm",
"post/:id": "showPost"
},
showPost: function(id) {
var that = this;
this.collection.fetch().complete(function() {
var curmodel = that.collection.get(id);
var post = new postView({
model: curmodel
});
post.render();
$(".maincontainer").html(post.el);
});
},
showForm: function() {
var that = this;
var qcView = new qcV({
collection: this.collection
});
qcView.render();
$(".maincontainer").html(qcView.el);
}
});
var PostView = Backbone.View.extend({
template: _.template(postTemplate),
events: {
'click .reply': 'addcomment',
'keypress textarea': 'addcommentOnEnter'
},
initialize: function() {
_.bindAll(this, "render", "addcomment", "addcommentOnEnter");
this.model.bind('change', this.render);
},
addcomment: function() {
this.model.comment($(".post-area").val());
},
addcommentOnEnter: function(e) {
if (e.keyCode != 13) return;
this.model.comment($(".post-area").val());
},
render: function() {
this.$el.html(this.template(this.model.toJSON()));
}
});
var qcView = Backbone.View.extend({
template: _.template(quickComposeTemplate),
events: {
'click .next-after': 'save',
},
render: function() {
console.log("qcV render");
this.$el.html(this.template({
user: window.user
}));
var postlist = new postOverViewList({
collection: this.collection
});
postlist.render();
$(".postoverview").html(postlist.el);
},
save: function() {
var that = this;
var newmodel = this.collection.create({
name: $('#big-input').val(),
firstRemark: $('#small-input').val(),
postedBy: window.user.displayName,
twitterHandle: window.user.twittername,
pictureUrl: window.user.profilePic
}, { wait: true });
var that = this;
this.collection.fetch().complete(function() {
window.location.href = "/#post/" + that.collection.last().get("_id")
});
},
});
var postOverViewList = Backbone.View.extend({
initialize: function() {
_.bindAll(this, 'render', 'addOne');
// this.listenTo(this.collection, 'add', this.addOne);
},
render: function() {
var that = this;
this.collection.fetch().complete(function() {
that.collection.forEach(that.addOne, that);
});
},
addOne: function(post) {
var posta = new postOverView({
model: post
});
posta.render();
this.$el.append(posta.el);
},
});
var postOverView = Backbone.View.extend({
template: _.template(postOverViewTemplate),
render: function() {
$('.quick-compose-posts').append(this.template(this.model.toJSON()));
},
});