私は backbone.js を初めて使用し、coupons.js の 67 行目でビューが定義されていない理由を突き止めるのに苦労しています。かなり長いファイルなので、要点を投稿しました。
また、ブラウザを何度も更新すると、最終的には問題なく動作し、再度更新すると壊れて、動作するまでもう一度更新してから、壊れるまでもう一度更新できます。痛いサイクル。
私は backbone.js を初めて使用し、coupons.js の 67 行目でビューが定義されていない理由を突き止めるのに苦労しています。かなり長いファイルなので、要点を投稿しました。
また、ブラウザを何度も更新すると、最終的には問題なく動作し、再度更新すると壊れて、動作するまでもう一度更新してから、壊れるまでもう一度更新できます。痛いサイクル。
このエラーは、null/未定義のオブジェクトでメソッドを呼び出そうとすると発生します。問題は、データを取得するための呼び出しofferList
が非同期であることですが、コレクション ビューを同期的にインスタンス化していることです。つまり、これはCouponCollectionView
のコンストラクターです。
this.collection.on('add remove', this.render, this);
コレクションがまだnullのときに呼び出されています:
var coupons = null;
$.getJSON('http://localhost:3000/api/coupons.json', function(response){
coupons = new CouponCollection(response);
app.coupons = coupons;
});
var coupons = new CouponCollection()
を使用して呼び出すことを検討することをお勧めします。これにより、コレクションがすぐにインスタンス化され、ビューでの呼び出しのcoupons.fetch()
準備が整います。on
を呼び出せるようにコレクションを設定しますfetch
。
var CouponCollection = Backbone.Collection.extend({
model: Coupon,
// tell Backbone where to send the "fetch" request
url: 'http://localhost:3000/api/coupons.json'
});
コレクションをすぐにインスタンス化し、fetch
それを呼び出します。
var coupons = new CouponCollection();
coupons.fetch();
コレクションにリスナーを追加しreset
(完了時にトリガーfetch
)、ハンドラーでビューをレンダリングします。
this.couponCollectionView = new app.CouponCollectionView({collection: this.couponList});
var self = this;
this.couponList.on("reset", function() {
$('#content').empty().append(self.couponCollectionView.render().el);
});