关于流星_uihooks以及触发它们的原因的困惑 [英] Confusion about Meteor _uihooks and what triggers them

问题描述

我很困惑 _uihooks 有效.看看下面的代码:

I'm confused about how _uihooks works. Check out the below code:

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?我在做什么错了?

I'd like the random thoughts to fade out/in nicely. But I never see anything show up in the console, so apparently it's not working. What exactly triggers _uihooks? What am I doing wrong?

推荐答案

您需要将调用._uihooks附加到所需节点的 parent DOM节点(不是JQuery对象)上.影响.您的情况是主页中的$('div.container').get(0).

You need to attach the call ._uihooks on the parent DOM node ( not a JQuery object) of the nodes you want the effects on. In your case this is $('div.container').get(0) in homePage.

您还需要插入或删除DOM节点，而不仅仅是对节点内部的文本进行反应式更新.这可以通过在模板中使用#each或#if来完成.

You also need to insert or remove a DOM node not just reactively update text inside a node. This could be done with an #each or #if in your template.

您还需要亲自在钩子中手动插入和删除DOM节点.否则，只会记录插入内容，而实际上不会在您的页面上显示任何内容.

You will also need to insert and remove the DOM node yourself manually within the hooks. Otherwise only inserts will be logged and nothing will actually show up on your page.

_uihooks在此处进行了解释，并提供示例此处.

_uihooks are explained here with an example here.

我已经制作了您的代码在meteorpad中工作的另一个示例.

这篇关于关于流星_uihooks以及触发它们的原因的困惑的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！