2012-11-27 19 views
8

मैं() बुनियादी प्रस्तुत करना() लाने के बाद संग्रह पर करने के लिए कोशिश कर रहा हूँ (रीढ़ 0.9.2):डिबगिंग Backbone.js: संग्रह के बाद प्रतिपादन लाने()

var ProjectListView = Backbone.View.extend({ 
     el: $('#container'), 
     initialize: function() { 
      this.collection = new ProjectsCollection(); 
      this.collection.bind("change", _.bind(this.render, this)); 
      this.collection.fetch({ success: function() { console.log("collection fetched"); } }); 
      ... 
      }, 
     render: function() { 
      console.log("rendered"); 
      ... 

नई देखें उदाहरण प्रिंट बाहर बनाना :

collection fetched

तो रेंडर() को fetch() के बाद कभी नहीं कहा जाता है। मुझसे यहां क्या गलत हो रहा है? कोई अपवाद मौजूद नहीं हैं।

रीडबोन में इस तरह की चीजों को डीबग करने के लिए कोई सुझाव?

Ps। ऐसा लगता है कि एसओ पर प्रश्नों की संख्या के कारण यह सुविधा खराब दस्तावेज है।

उत्तर

28

fine manual से:

लानेcollection.fetch([options])

लायें सर्वर से इस संग्रह के लिए मॉडल का डिफ़ॉल्ट सेट, आने पर संग्रह को रीसेट करना। [...] जब मॉडल डेटा सर्वर से वापस आता है, संग्रह रीसेट हो जाएगा।

और reset क्या करता है? reset करता है:

रीसेटcollection.reset(models, [options])

[...] रीसेट मॉडल की एक नई सूची के साथ एक संग्रह को बदलने के लिए प्रयोग करें (या हैश विशेषता), पर एक भी "reset" घटना को ट्रिगर समाप्त।

तो fetchreset कॉल संग्रह के मॉडल को अद्यतन करने और reset एक "reset" घटना है, न कि "change" घटना से चलाता है। मॉडल में से कोई भी नहीं बदला है और एक संग्रह की "change" घटनाएं इसके मॉडल से आती हैं।

आप render बाध्य किया जाना चाहिए था "reset" रहे हैं:

initialize: function() { 
    this.collection = new ProjectsCollection(); 
    this.collection.bind("reset", _.bind(this.render, this)); 
    this.collection.fetch(...); 
} 

आप तो आप संग्रह since करने के लिए एक "change" हैंडलर बाध्य कर सकते हैं निहित मॉडल पर "change" घटनाओं के लिए सुनने के लिए चाहते हैं:

आप "change" घटनाओं को अधिसूचित किया जा सकता है जब संग्रह में किसी भी मॉडल को संशोधित किया गया है,
[...]
संग्रह में किसी मॉडल पर ट्रिगर किए गए किसी भी ईवेंट को सुविधा के लिए सीधे संग्रह पर ट्रिगर किया जाएगा।

संग्रह भी संग्रह में ही बदल जाता है के रूप में "add" और "remove" घटनाओं उत्पन्न होगा। fetch दौरान रीढ़ की


नए संस्करणों को अब रीसेट संग्रह:

सर्वर से मॉडल डेटा रिटर्न, यह का उपयोग करता है करने के लिए सेट (समझदारी से) प्राप्त किए गए मॉडल विलय, जब तक आप पारित {reset: true}, इस मामले में संग्रह (कुशलतापूर्वक) रीसेट होगा।

और set:

[...] मॉडल के पारित कर दिया सूची के साथ संग्रह की एक "स्मार्ट" अद्यतन करता है। यदि सूची में कोई मॉडल संग्रह में अभी तक नहीं है तो इसे जोड़ा जाएगा; यदि मॉडल संग्रह में पहले से ही है तो इसके गुण विलय हो जाएंगे; और यदि संग्रह में ऐसे मॉडल हैं जो सूची में मौजूद नहीं हैं, तो उन्हें हटा दिया जाएगा। उचित "add", "remove", और "change" घटनाओं के सभी निकाल दिया जाता है ऐसा होता है के रूप में

तो रीढ़ के नए संस्करण के साथ आप और "add", "remove" के लिए सूचीबद्ध करने के लिए चाहता हूँ, "change" घटनाओं (जो एक संग्रह आधारित दृश्य चाहिए वैसे भी सुनना); आप प्रारंभिक fetch पर {reset: true} का भी उपयोग कर सकते हैं और "reset" पर भी सुन सकते हैं। मैं संग्रह आधारित विचारों के लिए निम्नलिखित दृष्टिकोण की सलाह देते हैं:

  1. "add" को सुनें और एक कॉलबैक कि बस देखने के लिए एक आइटम कहते हैं के साथ उस घटना को संभालने, सब कुछ फेंक नहीं है और फिर से प्रस्तुत करना।
  2. "remvoe" सुनें और उस ईवेंट को कॉलबैक के साथ संभाल लें जो केवल नए हटाए गए मॉडल को हटा देता है।
  3. "change" पर सुनें और उस कॉलबैक के साथ संभाल लें जो उचित आइटम को प्रतिस्थापित करता है (या अपडेट करता है)।
  4. "reset" पर सुनें और render पर बाध्य करें। फिर संग्रह के प्रारंभिक fetch कॉल पर {reset: true} पास करें।

जो महत्वपूर्ण घटनाओं को फंस जाएगा और संग्रह-दृश्य प्रत्येक को संभालने के लिए न्यूनतम मात्रा में काम करेगा। बेशक, यह रणनीति सभी परिस्थितियों पर लागू नहीं है लेकिन मुझे लगता है कि यह एक अच्छा प्रारंभिक बिंदु है।

+0

पूरी तरह उत्तर देने के लिए धन्यवाद, उम्मीद है कि यह दूसरों के लिए उपयोगी होगा। पुनश्च। क्या ऐसे अन्य संसाधन हैं जिन्हें आप आधिकारिक दस्तावेज़ों के अलावा अनुशंसा कर सकते हैं? – Fdr

+0

@ एफडीआर: मैंने संदर्भ के लिए दस्तावेज़ और स्रोत कोड पढ़ा। और 15+ सालों के बाद, सभी ढांचे बहुत समान दिखते हैं। –

+0

मुझे ऐसा लगता है।रीढ़ की हड्डी में ये घटनाएं थोड़ी सी यात्रा कर रही हैं: संग्रह के लिए "रीसेट" उठाया गया है, लेकिन मॉडल.फेटच() (जो "परिवर्तन" उत्सर्जित होने का कारण बनता है) में कोई समानता नहीं है। कमजोर एपीआई डिजाइन? – Fdr

3

ठीक है, इसलिए जब तक कुछ एक कारण है कि बाध्यकारी काम नहीं किया व्याख्या कर सकते हैं, मैं वैकल्पिक हल निम्नलिखित प्रयोग किया है:

initialize: function() { 
      var self = this; 
      this.collection = new ProjectsCollection(); 
      this.collection.fetch({ success: function() { self.render(); } }); 

7

यह 1,0

http://backbonejs.org/#changelog

में बदल रीसेट "आप का उपयोग जारी रखना चाहते हैं तो" ", पारित {रीसेट: सच}।"

संबंधित मुद्दे