Meteor flow-router Reference Error "class" is not defined

309 views Asked by At

I am using Meteor 1.2.1 and am running into an issue with FlowRouter. I have a '/' route declared in routes.jsx and it renders my Walls component in the MainLayout.

I added a second route '/brews' and a Brews component and and I get this error when I go to localhost:3000/brews:

Exception from Tracker recompute function:
debug.js:41 ReferenceError: Brews is not defined
    at FlowRouter.route.action [as _action] (router.jsx:9)
    at Route.callAction (route.js:51)
    at router.js:447
    at Object.Tracker.nonreactive (tracker.js:589)
    at router.js:431
    at Tracker.Computation._compute (tracker.js:323)
    at Tracker.Computation._recompute (tracker.js:342)
    at Object.Tracker._runFlush (tracker.js:481)
    at Object.Tracker.flush (tracker.js:441)
    at Router._invalidateTracker (router.js:489)

Here is the code:

**router.jsx***

FlowRouter.route('/', {
  action() {
    ReactLayout.render(MainLayout, { content: <Wall /> });
  }
});

FlowRouter.route('/brews', {
  action() {
    ReactLayout.render(MainLayout, { content: <Brews />});
  }
});



***wall.jsx*** *** This Renders fine ***

Wall = React.createClass({
  render() {
    return (
      <div className="footer">
        <h1>Welcome to the Wall!</h1>
      </div>
    )
  }
});


***brews.jsx***

Brews = React.createClass({
  render() {
    return (
      <div className="footer">
        <h1>Welcome to the Wall!</h1>
      </div>
    )
  }
});


***main.jsx***

MainLayout = React.createClass({
  render() {
    return (
      <div>
        <Header />
        <div className="container">
          {this.props.content}
        </div>
        <Footer />
      </div>
    )
  }
});



***main.html***

<head>
  <title>Example React App</title>
</head>

<body>
  <div id="react-root"></div>
</body>
0

There are 0 answers