How to update my composer after this.state has been updated

Hi everyone,

I run into a problem when trying to implement more React into my Meteor application.

At the moment I am using this.state to change my menu and navigate to different pages.

The problem I have now has to do with my composer that compiles my collection. It is only being called once when the page loads, but I want it to reload every time my state element activeCity get’s updated.

How am I able to achieve this result?

This is my current composer element:

const composer = (props, onData) => {
  const subscription = Meteor.subscribe('comments');
  if (subscription.ready()) {
  	const activeCity = props.activeCity;
    const comments =  Comments.find({approved: true, city: activeCity }, {sort: {timestamp: -1}}).fetch();
    onData(null, { comments });
  }
};

export default composeWithTracker(composer, Loading)(CommentsList);

So I have 3 different states of activeCity and I want this composer to re-render every time my city changes. But I have no idea how to achieve this result.

Before it would just re-render everytime I load a new page, but because everything is now happening on the same page this doesn’t happen anymore.

it is published, this should happen automatically as far as i can tell? page components can be re rendered using reacts component lifecycle bits (componentOn etc)… probably component will recieve etc.

Thanks so much for taking the time to reply.

I have set-up my application a bit differently and now just render a different page when my activeCity changes. Not completely as I wanted but it works :slight_smile:

for what it is worth, to avaiod this problem i ditched this.setState and all interaction is now using observables from mobX. This means it just works automatically instead of me dealing manually with this.setState.

Didn’t hear about observables or MobX before so going to check it out. Thnk