setTimeout仅在Meteor中与console.log一起运行

Question

I have the following code on a Meteor app

Template.timer.helpers({    
       currentTime: function(){
            //keep the current time stored in the session
            timeout = Meteor.setTimeout(function () {
              Session.set("now", new Date());
            }, 1000);
            console.log(Session.get('now'));
});
Template.timer.events({
    'click': function(){
        //some code
        Session.set("now", new Date());
        //some more code
    }
});

When there is a click event I get multiple timeouts running simultaneously, even though I'm only updating the Session once.

But, if I remove console.log in timer.helpers, then the setTimeout doesn't update the Session at all (only the Click does).

What am I missing?? Is there a better way to keep a current (reactive) client time stored?

Answer 1

If you want to update a client session with the latest client time every second, you can use Meteor.setInterval instead and set it up after the template has rendered. For example:

Template.timer.rendered = function() {
  Meteor.setInterval( function() {
    Session.set("now", new Date());
  }, 1000);
};

Template.timer.helpers({
  currentTime: function() {
    return Session.get("now");
  }
});

Answer 2

This is basically the essence of reactivity.

When a function which reruns reactively (which includes helper functions and autorun blocks) gets the value of a reactive object anywhere within its code, the function is registered as a dependency for that object. When the value of the object changes, the function's computation will be invalidated by the change of value, and the function will rerun itself.

So what happens here is that the console.log is, most importantly, get ting the value of your session variable, which makes the helper rerun every time it's set . However, it also sets a timeout callback which itself set s the value of the variable (to a value which is guaranteed to be different as it's the current time), which means the helper function will call itself again as soon as the timeout callback has run.

If you remove the console.log , you also remove the Session.get , which will remove the dependency and the helper will no longer rerun when the value of the Session variable is changed, whether by the timeout callback or elsewhere.

There are a lot of resources on the web to help understand reactivity, which is probably the most fundamental concept in learning Meteor.

https://meteorhacks.com/journey-into-meteors-reactivity.html http://manual.meteor.com/#deps-transparentreactiveprogramming http://richsilv.github.io/meteor/meteor-reactive-data-types/

Answer 3

  Tracker.autorun(function(){
            //keep the current time stored in the session
            timeout = Meteor.setInterval(function () {
              var se = Session.get("now");
              if(se === true){
                se = new Date();
                console.log(se);
              }else{
                 console.log("until click i start")
              }
            }, 1000);
            //console.log(Session.get('now'));
  });


Template.timer.events({
    'click': function(){
      console.log("clicked")
        Session.set("now",true);
    }
});

Try this code, this is what i change.

First, we just set a true/false , session inside the event, just to let know when the user, click the button.

and later, we put the the session inside a Tracker.autorun(function(){}) , with auto run we look for any change on the sessions, and remove the timeout for a interval, docs here

third, on the timeout variable, we look for variables changes, if "now" === true , we start the timer, if not, we send a friendly console.log .

That works form me.