相关疑难解决方法(0)

Backbone js .listenTo vs .on

以下2行代码有哪些优缺点?我不明白为什么有两种不同的方法来做同样的事情.

this.listenTo(app.Todos, 'change:completed', this.filterOne);
app.Todos.on('change:completed', this.filterOne);
Run Code Online (Sandbox Code Playgroud)

另外,在使用.on时,如何确定是否为默认上下文?

backbone.js

66
推荐指数
1
解决办法
3万
查看次数

BackboneJS渲染问题

在过去的六个月里,我一直在使用Backbone.前两个月一直在搞乱,学习并弄清楚我想如何构建我的代码.接下来的4个月正在掀起一场适合生产的应用.不要误会我的意思,Backbone已经把我从以前成为标准的数千行的客户端代码中解救出来,但它使我能够在更短的时间内完成更多宏伟的事情,从而打开一堆全新的问题.对于我在这里提出的所有问题,有简单的解决方案,感觉像黑客或只是感觉不对.我保证获得300点奖励以获得一个很棒的解决方案.开始:

  1. 正在加载 - 对于我们的用例(管理面板),悲观的同步很糟糕.对于某些事情,我需要在接受它们之前验证服务器上的内容.我们在'sync'事件合并到Backbone之前就开始了,

我们使用这个小代码来模仿加载事件:

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)

大.它按预期工作,但感觉不正确.我们将此事件绑定到所有相关视图并显示加载图标,直到我们从该模型收到成功或错误事件.有更好,更健全的方式吗?

现在为艰难的:

  1. 太多东西让自己太多了 - 让我们说我们的应用程序有标签.每个选项卡控制一个集合.在左侧,您可以获得该系列.单击模型以开始在中心编辑它.您更改其名称并按Tab键转到下一个表单项.现在,您的应用程序是一个"实时的东西",注意到差异,运行验证,并自动将更改同步到服务器,不需要保存按钮!很好,但表单开头的H2与输入中的名称相同 - 您需要更新它.哦,你需要更新列表中的名称.哦,名单按姓名排序!

这是另一个例子:您想在集合中创建一个新项目.按"新建"按钮,即可开始填写表格.您是否立即将该项目添加到集合中?但如果您决定丢弃它会发生什么?或者如果您将整个集合保存在另一个选项卡上?并且,有一个文件上传 - 您需要先保存并同步模型,然后才能开始上传文件(这样您就可以将文件附加到模型中).所以一切都开始渲染震动:你保存模型和列表,表格再次渲染自己 - 它现在已同步,所以你得到一个新的删除按钮,它显示在列表中 - 但现在文件上传完成上传,所以一切再次开始渲染.

添加子视图到混合,一切开始看起来像费里尼电影.

  1. 它的子视图一直向下 - 这是关于这些东西的好文章.我不能,因为对所有神圣事物的热爱,找到一种将jQuery插件或DOM事件附加到具有子视图的任何视图的正确方法.地狱随之而来.工具提示会听到渲染很长时间并且开始变得怪异,子视图变得像僵尸一样或者没有响应.这是主要的痛点,因为这里有实际的错误,但我仍然没有一个全面的解决方案.

  2. 闪烁 - 渲染速度很快.事实上,它是如此之快,我的屏幕看起来像是癫痫发作.有时它的图像必须再次加载(使用另一个服务器调用!),因此html最小化然后再次最大化 - 该元素的css宽度+高度将解决这个问题.有时候我们可以用fadeIn和fadeOut来解决这个问题 - 这是写作屁股的痛苦,因为有时我们会重复使用视图,有时会重新创建它.

TL; DR - 我在Backbone中遇到了查看和子视图的问题 - 渲染次数太多,渲染时会闪烁,子视图会分离我的DOM事件并吃掉我的大脑.

谢谢!

更多细节:BackboneJS与Ruby on Rails Gem.使用UnderscoreJS模板的模板.

javascript jquery node.js coffeescript backbone.js

32
推荐指数
2
解决办法
6017
查看次数

骨干,而不是"this.el"包装

我广泛使用模板,我喜欢使用完整包含的模板.我的意思是我想在模板代码中看到所有DOM元素,包括元素,如下所示:

<script type="text/template" id="template-card">
  <div class="card box" id="card-<%= id %>">
    <h2><%= title %></h2>
    <div><%= name %></div>
  </div>
</script>
Run Code Online (Sandbox Code Playgroud)

但Backbone喜欢的是这样的模板:

<script type="text/template" id="template-card">
  <h2><%= title %></h2>
  <div><%= name %></div>
</script>
Run Code Online (Sandbox Code Playgroud)

并在JS代码中定义元素及其属性.我认为是丑陋和混乱.

那么,任何避免我的Backbone View使用额外的DOM元素包装我的模板的好方法呢?

我一直在检查这个问题的主题:https://github.com/documentcloud/backbone/issues/546我明白没有任何正式方法可以做到这一点..但也许你可以推荐我非官方的方式.

backbone.js

25
推荐指数
1
解决办法
6297
查看次数

标签 统计

backbone.js ×3

coffeescript ×1

javascript ×1

jquery ×1

node.js ×1