Missing) after argument list when using a reactive router
I am using React-router v0.13.3 and React 0.13.3 to create a simple web app. But the big problem came up when I tried to integrate with React-Router.
So here's the error message:
Uncaught SyntaxError: missing ) after argument list
app.jsx
var Router = window.ReactRouter;
var Route = Router.Route;
app.VIEW_SEARCH = 'search_view';
app.VIEW_FAVORITE = 'favorite_view';
app.VIEW_RESULT = 'result_view';
var RouteHandler = Router.RouteHandler;
var App = React.createClass({
render () {
return (
<div>
<h1>App</h1>
<RouteHandler/>
</div>
)
}
});
// declare our routes and their hierarchy
var routes = (
<Route handler={App} path="/">
<Route path="search" handler={app.SearchView}/>
<Route path="about" handler={app.AboutView}/>
<Router.DefaultRoute handler={app.SearchView}/>
</Route>
);
Router.run(routes, Router.HistoryLocation, (Root) => {
React.render(<Root/>, document.body);
});
The basic JavaScript codes pasted above, the error appeared when I added the last 3 lines. And the web app uses conversation to manage dependencies.
if i use
Router.run(routes, Router.HistoryLocation, function(handler) {
React.render(<handler/>, document.body);
});
to replace the last 3 lines. Nothing is displayed on the screen. Does anyone know how to solve it?
source to share
The parenthesis error is probably related to the arrow function you are using. This is an ecmascript 6 feature and is not yet supported by most browsers.
Since you are using gulp it will be very easy for you to add babel to your build steps. Otherwise, just use the "old" notation:function(Root) {return ...}
As for the second problem you point out in your comments, we need the source code Root
to try and understand what's going on.
source to share