meteor - 关于 Meteor _uihooks 和触发它们的混淆

Question

我很困惑 _uihooks作品。查看以下代码:

home.html

<template name="homePage">
  <section id="home-page">
    <div class="container">
      <h1>Thought of the day:</h1>

      <div id="totd">
        <span>{{thought}}</span>
      </div>

    </div>
  </section>
</template>

home.coffee

timer = 0

Template.homePage.rendered = ->
  this.find('#totd')._uihooks =
    insertElement: (node, next) ->
      console.log 'Inserted'
    removeElement: (node) ->
      console.log 'Removed'

  Session.set 'randThought', Random.choice thoughts
  timer = Meteor.setInterval shuffleThoughts, 5000

Template.homePage.destroyed = ->
  Meteor.clearInterval timer

thoughts = [
  "My socks smell like sausages."
  "I sure wish I had a bag of crisps right about now."
  "I need more thoughts."
]

Template.homePage.helpers
  thought: -> Session.get 'randThought'

shuffleThoughts = ->
  Session.set 'randThought', Random.choice thoughts

我希望随意的想法能够很好地淡出/淡入。但是我从来没有在控制台中看到任何东西，所以显然它不起作用。究竟是什么触发了 _uihooks？我做错了什么？

Answer 1

您需要在您想要影响的节点的父 DOM 节点(不是 JQuery 对象)上附加调用 ._uihooks。在您的情况下，这是主页中的 $('div.container').get(0)。

您还需要插入或删除 DOM 节点，而不仅仅是响应式地更新节点内的文本。这可以通过模板中的 #each 或 #if 来完成。

您还需要在 Hook 中手动插入和删除 DOM 节点。否则只会记录插入，而不会实际显示在您的页面上。

_uihooks 解释 here举个例子 here .

我做了another example with your code working in meteorpad .