Skip to content Skip to sidebar Skip to footer

Conditional Rendering In Meteor + React

I'm trying to get some conditional rendering in Meter + React. I only want a component to show up if the number of items returned from a collection === 0. I tried this: renderInpu

Solution 1:

You must wait for the data to finish with synchronization. The flash is there because initially MiniMongo collections are empty. (Also, you might want to avoid Collection.find() in your render function.)

Assuming you use Meteor 1.3.x:

exportconstMyComponent = createContainer(() => {
  let subscription = Meteor.subscribe('something');
  if (!subscription.ready()) return {};
  return {
    tokens: Tokens.find().fetch()
  }
}, InternalComponent);

And then check for the existence of props.tokens in your React component.

classInternalComponentextendsReact.Component{
  render() {
    if (!this.props.tokens || this.props.tokens.length > 0) return;
    return <TokenForm />;
  }
}

Find out more about subscriptions here: http://docs.meteor.com/#/full/meteor_subscribe

Post a Comment for "Conditional Rendering In Meteor + React"