Is it correct to use Meteorjs with Reactjs?

I have added the package "meteor-react" and am proceeding to the microscope manual. Along the way, I just replace the Blaze template steps with React, but I'm not sure how to do this correctly so that Collections will be responsive to the Reactjs framework.

"Posts" - Mongo collection. In my main.js:

// Startup application
Meteor.startup(function() {
   var target = document.getElementsByTagName('body')[0]; 
   var data = Posts.find().fetch();  // RACE CONDITION occurs here.
   React.renderComponent(new StreamAtom({ "data": data}), target);
});

      

In react component StreamAtom.jsx "data" is simply set as the initial state.

Problem:

There is a race condition with the Posts.find () function. fetch (), so most of the time the page doesn't render. There are no callbacks in Meteor and Blaze care about "Posts.find ()" without callbacks, so what am I missing?

Also, how can I only use Posts.find () without fetching? Since fetch () returns an array of results and not a Mongo cursor, I'm afraid React won't actually react to changes in the collection.

Thank you very much in advance,

Hope this helps me understand meteor better.

+3


source to share


1 answer


Wrap your React render function call in Tracker.autorun

- this is how most of the reactions on the client side of Meteor react:

// Startup application
Meteor.startup(function() {
  Tracker.autorun(function () {
   var target = document.getElementsByTagName('body')[0]; 
   var data = Posts.find().fetch();  // RACE CONDITION occurs here.
   React.renderComponent(new StreamAtom({ "data": data}), target);
  });
});

      



Detailed Tracker Guide: https://github.com/meteor/meteor/tree/devel/packages/tracker

+6


source







All Articles