在使用react-router时参数列表之后丢失)

时间:2015-06-29 14:34:55

标签: reactjs react-router

我正在使用React-router v0.13.3和React 0.13.3来构建一个简单的Web应用程序。 但是当我尝试与React-Router集成时,就出现了一个大问题。

所以,这是错误信息: 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);
  });

上面粘贴的主要JavaScript代码,当我添加最后3行时出现错误。 Web应用程序正在使用bower来管理依赖项。

如果我使用

  Router.run(routes, Router.HistoryLocation, function(handler) {
    React.render(<handler/>, document.body);
  });

替换最后3行。屏幕上没有显示任何内容。 有谁知道如何解决它?

1 个答案:

答案 0 :(得分:2)

括号错误可能是因为您使用的arrow function。这是一个ecmascript 6功能,不幸的是现在大多数浏览器都不支持。

由于您使用gulp,因此您可以非常轻松地将babel添加到构建步骤中。 否则,只需使用“旧”表示法:function(Root) {return ...}

至于您在评论中指出的第二个问题,我们需要Root的源代码来尝试了解正在发生的事情。