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


#1

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.


#2

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.


#3

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:


#4

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.


#5

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