关于 Meteor _uihooks 以及触发它们的原因的困惑 [英] Confusion about Meteor _uihooks and what triggers them
问题描述
我很困惑 _uihooks 有效.查看以下代码:
home.html
<section id="主页"><div class="容器"><h1>当天的想法:</h1><div id="totd"><span>{{thought}}</span></节>
home.coffee
timer = 0Template.homePage.rendered = ->this.find('#totd')._uihooks =插入元素:(节点，下一个)->console.log '插入'removeElement:(节点)->console.log '已删除'Session.set 'randThought', Random.choice 想法计时器 = Meteor.setInterval shuffleThoughts, 5000Template.homePage.destroyed = ->Meteor.clearInterval 计时器想法 = [我的袜子闻起来像香肠."我当然希望我现在有一袋薯片."我需要更多的想法."]模板.homePage.helpers想:->Session.get 'randThought'shuffleThoughts = ->Session.set 'randThought', Random.choice 想法我希望随机的想法很好地淡出/淡入.但是我从未在控制台中看到任何内容，因此显然它不起作用.究竟是什么触发了 _uihooks?我做错了什么?
您需要在 parent DOM 节点(不是 JQuery 对象)上附加调用 ._uihooks您想要效果的节点.在您的情况下，这是主页中的 $('div.container').get(0) .
您还需要插入或删除 DOM 节点，而不仅仅是被动地更新节点内的文本.这可以通过模板中的 #each 或 #if 来完成.
您还需要自己在钩子中手动插入和删除 DOM 节点.否则只会记录插入内容，而您的页面上实际上不会显示任何内容.
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
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?
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.
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.
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 are explained here with an example here.
I have made another example with your code working in meteorpad.
这篇关于关于 Meteor _uihooks 以及触发它们的原因的困惑的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
