Should I us reactive value by "templat helper" vs "jQuery style"?

help
1

Should I use reactive value by template helper vs jQuery style.

// Template
<template name='"myTpl">
   <input type="text" id="myName" class="myName">
   <h1>{{myName}}</h1>
</template>

// Js
Template.myTpl.onCreated(function (){
  this.myName = new ReactiveVar("foo");
});
Template.myTpl.helpers({
  myName: function () {
    var template = Template.instance();
    return template.myName.get();
  }
});
Template.myTpl.events({
  "keyup .myName": function (event, template) {
    var name = event.target.id;
    template.myName.set(name.val());
  }
});
------------------------------------------------------------------
// Template
<template name='"myTpl">
   <input type="text" id="myName" class="myName">
   <h1 id="display"></h1>
</template>

// Js
Template.myTpl.events({
  "keyup .myName": function (event, template) {
    var name = event.target.id;
    $('#didplay').html(name.val());
  }
});

Which better?

2

Avoid jQuery style data transformations. Let Meteor do the heavy lifting for you. That way if you need to modify that value by some other means there is one true data source, the reactive var.

That’s part of the reason why React for example has gotten so popular. It makes it much easier to reason about.

1 Like