Closed davedx closed 10 years ago
I think that the reason why you are getting that error is that Home is being declared local to the jsx file, and you are trying to access it from a different file.
Meteor wraps each file in the project with a (function() {})()
call, so when you declared var Home = ...
you only declared the Home component local to the file. To declare Home globally, you can simply remove the var keyword.
In addition, I should note that your call <a href={home()}>Home</a>
will probably throw an error as home()
is not defined. I assume you want home()
to return the url '/'. You will probably want to declare a Routes global variable and put the return value from this.route()
as a property of it.
/** @jsx React.DOM */
var Home = React.createClass({
render: function() {
return (
<div>
<h1>Home</h1>
<a href={Routes.home()}>Home</a>
</div>
);
}
});
Routes = {};
RouteCore.map(function() {
Routes.home = this.route('/', function(ctx) {
return Home({});
});
});
Aha, understood! Thanks for the detailed explanation. I will give it another try. :)
Hi there,
I've been using ReactJS a lot at work so was excited about this project. :)
I'm currently having trouble as my JSX file doesn't seem to get transformed and/or be found by Meteor. I have a components directory with home.jsx in it with this code:
And in the root of my project a router:
But I get this when I hit /:
W20140306-08:27:36.576(1)? (STDERR) Error while rendering path: / ; error: ReferenceError: Home is not defined
Any ideas what might be happening? This is with an existing project that also has Iron-Router, so I'm not sure if it might be conflicting.