How to control meteor data stream with react?

- 1 answer

Ad

I am using react and meteor, I am having trouble getting data from the server at one time. The component is getting the data in a stream and the component's render function is being called multiple times.

This is the code I am using to get the posts from the server on the client inside the react component with the mixin.

getMeteorData() {
        return {
            posts: Posts.find({}, {sort: {createdAt: -1}}).fetch()
        }
    },

As of now this is getting all of the posts from the server (there is only about 20 in there)

How do I get the data from the server at once so it doesn't stream and call the render function multiple times?

Ad

Answer

Ad

Add extra check if the loading of the data is done for example:

  mixins: [ ReactMeteorData ],
  getMeteorData() {
    var subscription = Meteor.subscribe( 'posts' );

    return {
      isLoading: !subscription.ready(),
      posts: Posts.find({}, {sort: {createdAt: -1}}).fetch()
    };
  },
  render() {
    if ( this.data.isLoading ) {
      return <div>Loading...</div>;
    } else {
      return (
        // now we have data and render once
      );
    }
  }
Ad
source: stackoverflow.com
Ad