Javascript 主干导航错误
每当我在浏览器中按下“后退”按钮时,视图都是空的,我会得到如下错误:Javascript 主干导航错误,javascript,backbone.js,backbone-views,Javascript,Backbone.js,Backbone Views,每当我在浏览器中按下“后退”按钮时,视图都是空的,我会得到如下错误: var AppRouter = Backbone.Router.extend({ initialize: function() { this.model = new model(); this.collection = new collection(); }, routes: { "": "showForm", "post/:id":
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()));
},
});
我真的不知道我的应用程序应该放在这里的哪个部分来帮助解决这个问题,但是没有一个错误涉及到我的代码的一部分
有趣的是,如果我按下前面的按钮,再按下后面的按钮,所有的东西都会完美地呈现出来,错误也就不存在了
我的路由器和视图如下所示:
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()));
},
});
您可以发布整个代码吗..它无法从
this.model.bind('change',this.render)
中调用this.render