Question

尝试学习Backbone并在尝试获取数据时遇到绊脚石，我用我的视图SearchBarView从数据中获取数据很好但是一旦获取了数据，我不知道如何获取这些数据在我的SearchResultsView中为了模板化每个结果？

很抱歉，如果这听起来有点模糊，那么现在正在努力解决这个问题，所以可以在指导下做到这一点！

SearchBarView

performSearch: function(searchTerm) {

            // So trim any whitespace to make sure the word being used in the search is totally correct
            var search = $.trim(searchTerm);

            // Quick check if the search is empty then do nothing
            if(search.length <= 0) {
                return false;
            }

            // Make the fetch using our search term
            dataStore.videos.getVideos(searchTerm);

        },

转到VideoSearchCollection

getVideos: function(searchTerm) {

            console.log('Videos:getVideos', searchTerm);

            // Update the search term property which will then be updated when the url method is run
            // Note make sure any url changes are made BEFORE calling fetch
            this.searchTerm = searchTerm;

            this.fetch();
        },

SearchResultsView

initialize: function() {

            // listens to a change in the collection by the sync event and calls the render method
            this.listenTo(this.collection, 'sync', this.render);

            console.log('This collection should look like this: ', this.collection);
        },


        render: function() {

            var self = this,
                gridFragment = this.createItems();

                this.$el.html(gridFragment);

            return this;
        },


        createItems: function() {

            var self = this,
                gridFragment = document.createDocumentFragment();

                this.collection.each(function (video) {
                    var searchResultView = new SearchResultView({
                        'model': video
                    });

                    gridFragment.appendChild(searchResultView.el);

                }, this);


            return gridFragment;

        }

现在我不确定如何在SearchResultView内获取此数据，我想我需要从某处触发事件并在initialize函数中侦听事件但我不是确定我在哪里触发或者触发是自动进行的。

Answer 1

如何初始化SearchResultView并不是100％清楚。

但是，为了引用该集合，您不能简单地将引用传递给视图的构造函数。像这样：

//在SearchbarView中

var myCollection = new Backbone.Collection(); // and you are populating the collection somewhere somehow 
var searchResultView = new SearchResultView(myCollection) // you just pass this collection as argument.
myCollection.bind("change", function(){
   searchResultView.parentCollection = myCollection;
 }

在searchResultView中，您只需通过parentCollection引用此集合。

如果您更明确地了解这两个视图的连接方式或相关方式，我可以为您提供更多帮助。但是，有了给定的信息，这似乎是最简单的方法。

Answer 2

解决方案1 

如果dataStore是全局变量那么 SearchBarView

dataStore - appears like a global variable
videos - a collection attached to global variable

然后在

SearchResultsView

this.listenTo(dataStore.videos, 'sync', this.render);

解决方案2

如果dataStore不是全局变量

getVideos: function(searchTerm) {

            console.log('Videos:getVideos', searchTerm);

            // Update the search term property which will then be updated when the url method is run
            // Note make sure any url changes are made BEFORE calling fetch
            this.searchTerm = searchTerm;

            var coll=this;       //this should refer to the collection itself
            this.fetch().done(function(){
                var searchResultView = new SearchResultsView({collection:coll});
                searchResultView.render();
            });
        },

如何在另一个视图中使用获取的主干集合数据？

2 个答案: