meteormeteor-helper

Meteor - Reactive Objects/Classes


TLDR

I like to really focus on keeping business logic away from the view model / controller. I find this sometimes rather hard in Meteor. Maybe I'm missing the point but I am after one of two things really:

1) A really good document explaining at a really low level how reactive values are being used. 2) A package that somehow manages an object so that if any of the setters are altered, they notify all of the get functions that would change as a result.

Unfortunately I've not seen either.

My Example

I have a fair bit ob business logic sitting behind a dialog used to document a consultation. I might have an event that sets a change of state.

I'd like to do something like this in the event:

const cc = new ConsultationEditor();
cc.setChiefComplaint(event.target.value);
console.log(cc.data());
ConsultationDict.set("consEdit", cc.data() );

When the user has updated this value, I'd then like to show a number of fields, based on the change. For this I have a helper with the following:

fields: function(){
  console.log("trying to get fields");
  const obj = ConsultationDict.get('consEdit');
  cc = new ConsultationEditor(obj);
  return cc.getFields();
}

But unfortunately this does not work for me.


Solution

  • What is your ConsultationDict?

    The way you describe it, you want it to be a ReactiveDict as in the official ReactiveDict package.

    https://atmospherejs.com/meteor/reactive-dict

    Check this tutorial for examples:

    https://themeteorchef.com/snippets/reactive-dict-reactive-vars-and-session-variables/

    If you really need more fine tuning in your reactivity, you can also set a dependency tracker tracker = new Tracker.Dependency, and then refer to it wherever you change a variable with tracker.changed() and where the data needs to be notified with tracker.depend() like this:

    var favoriteFood = "apples";
    var favoriteFoodDep = new Tracker.Dependency;
    
    var getFavoriteFood = function () {
      favoriteFoodDep.depend();
      return favoriteFood;
    };
    
    var setFavoriteFood = function (newValue) {
      favoriteFood = newValue;
      favoriteFoodDep.changed();
    };
    
    getFavoriteFood();
    

    See the full Tracker doc here:

    https://github.com/meteor/meteor/wiki/Tracker-Manual

    I also found this gist to be useful to build reactive objects:

    https://gist.github.com/richsilv/7d66269aab3552449a4c

    and for a ViewModel type of behavior, check out

    https://viewmodel.meteor.com/

    I hope this helps.