跟踪收集的旧部分和新部分
我正在使用backbone.js，并且我有一个带有fetch()的集合。 我不想传递选项{add: true}因为我的子视图的创建方式（集合循环遍历，每个项目都是附加到当前表格的新行）。 我试过的一件事就是清空整个表并创建所有新行，但这很慢，因为fetch()经常运行（当滚动接近表的末尾时）。 它开始滞后。
我希望有一个替代方案，我可以跟踪新的集合用于追加目的，但将整个集合作为一个实体。 一种可能性是创建第二个集合，然后将其添加到第一个集合中，但我不确定如何/如果我应该这样做。
在添加新模型后，您可以跟踪集合的当前长度，将其用作偏移量，以便将模型从该点渲染到集合的末尾。
更新：当我查看下划线文档时，我注意到了这一点： http ： //documentcloud.github.com/underscore/#rest
总结一下这样做：
rest _.rest（array，[index]） 别名：tail
返回数组中的其余元素。 传递索引以从该索引开始返回数组的值。
有了这个，你只需要跟踪你的长度是多少，然后将其他项目添加到集合中，然后将其作为索引传递给rest。
我认为创建第二个新模型集合是多余的。 我试图想象你的设置，这里有一些解决方案的想法。
也许一种方法是改变你做子视图的方式。
当你获取（）它会重置你的集合，你似乎只需要使用新模型。 在这种情况下，使用带有{add：true}的fetch听起来像是一个更好的解决方案。 你提到你的子视图创建是循环的，我想象当你重置集合时，必须循环并创建所有新的子视图可能会很慢。 您是否可以更改子视图创建以使其对应于每个模型？ 因此，对于添加到集合中的每个新模型，附加子视图。
我在想像Todo.js这样的例子。 但你问题的背景可能完全取决于我所看到的。
编辑：如何访问您要添加到集合中的新模型
根据我们的讨论，我发现这个线程确认了我对fetch success选项和参数的看法。
在Backbone.js中，在执行collection.fetch（{‘add’：true}）之后，如何获取检索到的最新元素？
EDIT2：完整的工作骨干示例
这是OUTPUT（这样的东西）：
Pokemon Users Audino // These are in our initial collection Bulbasaur Charmander Caterpie // These are added to our collection using fetch() Butterfree Squirtle
这是HTML：
Pokemon Users
这是JS：
var User, UserCollection, UserView, AppView; // Each User model has 1 attribute name User = Backbone.Model.extend({ defaults: { name: "changeMe" } }); // Our collection of Users UserCollection = Backbone.Collection.extend({ model: User, url: 'user' }); // Initialize our collection (nothing in it right now) var myCollection = new UserCollection; // Our UserView is each individual view, represented by the user model UserView = Backbone.View.extend({ tagName: 'div', className: 'user', render: function() { $(this.el).html(this.model.get("name")); return this; } }); // AppView is the larger view that contains the sub-views AppView = Backbone.View.extend({ el: $('#app'), initialize: function() { // Binding the view to collection add events! <- This is the key myCollection.on('add', this.addOne, this); // on/bind }, addOne: function(user) { var view = new UserView({model:user}); $('#userList').append(view.render().el); } }); // Initialize the AppView -> Rock and Roll Time var myApp = new AppView(); // I'm creating 3 new models var userA, userB, userC; userA = new User(); userA.set({name:"Audino"}); userB = new User({name:"Bulbasaur"}); userC = new User({name:"Charmander"}); var userAry = [userA,userB,userC]; // I'm adding these models into my collection myCollection.add(userAry); // When you take a look at the collection now, it only has 3 models console.log(myCollection); // Now we fetch the other 3 models from the server using {add:true} // Try commenting this fetch call out to see the output minus new models myCollection.fetch({ add: true, success: function(collection, response) { // Just some extras to illustrate the success callback and args // console.log('collection: '); // console.log(collection); // console.log('response: '); // console.log(response); } }); // The collection is updated rather than reset - necessary subview changes made console.log(myCollection);
以下是PHP服务器代码 – 我使用Slim PHP进行路由：
// Returns a JSON Collection $app->get('/user', function() use ($app) { $userD = array("name"=>"Caterpie"); $userE = array("name"=>"Butterfree"); $userF = array("name"=>"Squirtle"); $userAry = array(); array_push($userAry, $userD, $userE, $userF); $json = json_encode($userAry); $response = $app->response(); $response['Content-Type'] = 'application/json'; $response->body($json); });
这很有趣。 我自己学到了一些东西 希望能帮助到你！ 🙂