在过去的六个月里,我一直在使用Backbone.前两个月一直在搞乱,学习并弄清楚我想如何构建我的代码.接下来的4个月正在掀起一场适合生产的应用.不要误会我的意思,Backbone已经把我从以前成为标准的数千行的客户端代码中解救出来,但它使我能够在更短的时间内完成更多宏伟的事情,从而打开一堆全新的问题.对于我在这里提出的所有问题,有简单的解决方案,感觉像黑客或只是感觉不对.我保证获得300点奖励以获得一个很棒的解决方案.开始:
我们使用这个小代码来模仿加载事件:
window.old_sync = Backbone.sync
# Add a loading event to backbone.sync
Backbone.sync = (method, model, options) ->
old_sync(method, model, options)
model.trigger("loading")
Run Code Online (Sandbox Code Playgroud)
大.它按预期工作,但感觉不正确.我们将此事件绑定到所有相关视图并显示加载图标,直到我们从该模型收到成功或错误事件.有更好,更健全的方式吗?
现在为艰难的:
这是另一个例子:您想在集合中创建一个新项目.按"新建"按钮,即可开始填写表格.您是否立即将该项目添加到集合中?但如果您决定丢弃它会发生什么?或者如果您将整个集合保存在另一个选项卡上?并且,有一个文件上传 - 您需要先保存并同步模型,然后才能开始上传文件(这样您就可以将文件附加到模型中).所以一切都开始渲染震动:你保存模型和列表,表格再次渲染自己 - 它现在已同步,所以你得到一个新的删除按钮,它显示在列表中 - 但现在文件上传完成上传,所以一切再次开始渲染.
添加子视图到混合,一切开始看起来像费里尼电影.
它的子视图一直向下 - 这是关于这些东西的好文章.我不能,因为对所有神圣事物的热爱,找到一种将jQuery插件或DOM事件附加到具有子视图的任何视图的正确方法.地狱随之而来.工具提示会听到渲染很长时间并且开始变得怪异,子视图变得像僵尸一样或者没有响应.这是主要的痛点,因为这里有实际的错误,但我仍然没有一个全面的解决方案.
闪烁 - 渲染速度很快.事实上,它是如此之快,我的屏幕看起来像是癫痫发作.有时它的图像必须再次加载(使用另一个服务器调用!),因此html最小化然后再次最大化 - 该元素的css宽度+高度将解决这个问题.有时候我们可以用fadeIn和fadeOut来解决这个问题 - 这是写作屁股的痛苦,因为有时我们会重复使用视图,有时会重新创建它.
TL; DR - 我在Backbone中遇到了查看和子视图的问题 - 渲染次数太多,渲染时会闪烁,子视图会分离我的DOM事件并吃掉我的大脑.
谢谢!
更多细节:BackboneJS与Ruby on Rails Gem.使用UnderscoreJS模板的模板.
我有点卡住实现了骨干比较器,我基本上想要根据路由选择不同的排序方法,并使用比较器对集合进行排序.理想情况下,我希望将排序逻辑封装在集合中,但似乎陷入困境.例如
Requests = Backbone.Collection.extend({
model : Request,
comparator : function(ab) {
return -ab.id;
},
nooffers : function() {
return this.sortBy(function(ab) {
return ab.get('offers');
});
}
});
Run Code Online (Sandbox Code Playgroud)
因此,默认情况下,它会根据默认比较器进行排序 - 但在我的路由中,我希望能够采取类似的措施
routes : {
"" : "index",
'/ordering/:order' : 'ordering'
},
ordering : function(theorder) {
ordering = theorder;
if(theorder == 'nooffers') {
Request.comparator = Request.nooffers();
}
Request.sort();
listView.render();
howitworksView.render();
}
Run Code Online (Sandbox Code Playgroud)
但是在那种情况下,我得到一个错误('c.call不是函数')任何想法?
我正在关注David Sulc关于Marionette的教程. http://davidsulc.com/blog/2012/04/15/a-simple-backbone-marionette-tutorial/,以便学习扩展它.
现在让我们说每只猫都有一个名字,等级和类别
AngryCat = Backbone.Model.extend({
urlRoot: '/api/cats',
defaults: {
name: "New Cat Name",
category: "Red Cat"
}
});
Run Code Online (Sandbox Code Playgroud)
现在我想制作一个这样的复合视图:
第1类:红猫(03猫)
猫1
猫2
猫3
第2类:蓝猫(02猫)
猫X.
猫Y.
我怎样才能做到这一点.请帮忙!