如果我们在websql事务中进行渲染，那么backbonejs jquery移动视图渲染就搞砸了

Question

民间， 考虑下面coffeescript中的观点：

window.Aview = class AView extends Backbone.View

  getT: (callback) =>
    callback()

  getTransactions: (callback) =>
    @getT( =>
      callback()
    )            
  render: =>
   @getTransactions(
     (results) =>
       $(@el).html(@template({}))
   )

按预期呈现（如下所示）：

但是，如果我更改getTransactions中的逻辑以使用window.db.transaction（window.db指向websql db变量），如下所示：

  getTransactions: (callback) =>
    window.db.transaction( =>
      callback()
    )          

然后渲染被搞砸了，如下所示：

我不确定为什么会这样。我认为这很可能不是使用backbonejs的方法，但我很好奇为什么当我使用window.db.transaction而不是本地定义的getT方法时，jquery移动选项卡的渲染会搞砸。

感谢您的帮助！

Answer 1

我想出了这个问题。我怀疑，我在多个级别做错了。这里的目标是从websql数据库呈现数据。问题是数据库数据是通过回调异步返回的。您的视图需要“等待”直到数据完成。正确的方法是

1. 使用jquery deferreds（参见http://eng.wealthfront.com/2012/12/jquerydeferred-is-most-important-client.html文章）
2. 在backbonejs视图的render方法中 - 使用常规的主干js渲染机制呈现没有数据的页面
3. 使用jquery promise接口渲染动态内容（您的查询异步返回的数据）： txnsLoadedPromise.then（ //在这里渲染动态的东西 ）
4. 调用触发器create以应用jquery增强功能（请参阅http://view.jquerymobile.com/1.3.0/docs/faq/injected-content-is-not-enhanced.php ） 我之所以搞砸UI，是因为需要以编程方式为动态DOM元素应用jquery增强功能。