Search code examples
meteormeteor-react

Meteor createContainer resubscribe for data


This is my createContainer wrapper:

export default createContainer(({params}) => {
  const currentUser = Meteor.user();

  let itemsCount = 10;
  const subs = Meteor.subscribe('items', itemsCount);
  const items = Items.find({}, {sort: {country: 1, lastUpdateCheck: -1}}).fetch();

  return {
    items,
    currentUser,
  };
}, MyComponent);

I would like to put Load More button somewhere in MyComponent component, and when the button is pressed increment the itemsCount in createContainer to subscribe for more data. Is it possible at all to change variable in createContainer? Or any other ways?


Solution

  • One way you could do this is by using a ReactiveVar to hold your itemsCount, then pass this ReactiveVar down into your MyComponent as a prop. When the load more button is clicked, you could change the itemsCount value, which will cause your createContainer code to re-run. Quick example:

    const itemsCount = new ReactiveVar(10);
    
    export default createContainer(({params}) => {
      const currentUser = Meteor.user();
      const subs = Meteor.subscribe('items', itemsCount.get());
      const items = Items.find(
        {}, 
        {sort: {country: 1, lastUpdateCheck: -1}}
      ).fetch();
    
      return {
        items,
        currentUser,
        itemsCount,
      };
    }, MyComponent);
    

    then in your MyComponent you would call a this.props.itemsCount.set(X) somewhere after the load more button is clicked.