再次提出另一个关于我的todo-app的问题。
目前发展情况良好。现在可以添加待办事项，删除待办事项，编辑待办事项和完成＆＃39;待办事项＆＃39; S
您可以在此处查看结果：http://todoapp.lusenet.com/
该应用包含视图：TodoView和AppView。 AppView使用TodoView呈现应用程序。
当加载应用程序时，将调用AppView的initialize: function(){
this.input = this.$('#addTodo');
this.todoCollection = new app.TodoCollection(); // Create collection
this.todoCollection.fetch({reset: true}); // Fetch items
this.listenTo(this.todoCollection, 'reset', this.addAll);
this.listenTo(this.todoCollection, 'add', this.addOne);
}
函数。这就是那里发生的事情：
reset所以我创建了一个新的集合，获取其中的模型，这会触发reset事件。 addAll然后调用addAll函数。
这是addAll: function(){
var i = 0,
self = this;
this.$('#todoList').html(''); // clean the todo list
this.todoCollection.each(function(todo){
i++;
setTimeout(function(){
self.addOne(todo);
}, 200*i);
});
}
函数：
addOne此函数只循环遍历整个集合，并为每个模型调用addOne。这是在超时时间内完成的，因此模型会一个接一个地附加。
这是addOne: function(todo){
var view = new app.TodoView({model: todo}).render();
$(view.el).appendTo('#todoList');
}
函数：
addOne我的麻烦开始了。 -webkit-transition: all 2000ms ease-out;
-moz-transition: all 2000ms ease-out;
-ms-transition: all 2000ms ease-out;
-o-transition: all 2000ms ease-out;
transition: all 2000ms ease-out;
bottom:-2px;
opacity: 0;
函数在列表中附加模型，这完全没问题。当我将这个CSS添加到模型时：
addClass添加后隐藏模型，这就是我想要的。我想，如果我在追加后调用addOne，我可以为模型设置动画。所以我添加了一行代码来制作addOne: function(todo){
var view = new app.TodoView({model: todo}).render();
$(view.el).appendTo('#todoList');
view.$el.addClass('show');
}
函数，如下所示：
=IF(COUNT(B1:B10),SUM(B1:B10),"")
这样做，只有模特已经有了这个类＆＃39;显示＆＃39;当我追加它时，不会发生淡入淡出。如何在追加完成后添加类？或者我只是完全错了？
谢谢！
答案 0 :(得分：1)
在添加类之前，浏览器可能没有足够的时间将元素插入到DOM中。
我尝试使用setTimeout，你真的不需要那么大的值。
addOne: function(todo){
var view = new app.TodoView({model: todo}).render();
view.$el.appendTo('#todoList');
setTimeout(function(){
view.$el.addClass('show');
}, 40);
}
这实际上是一个众所周知的技巧，some people even call it with 0 timeout。