我有一个阵营应用程序，其中main.js调用app.js，可呈现作为父组件 - 因为在这里可以看到：建立反应路由器的流量应用

React.render(<APP />, document.getElementById("main"));

现在我需要设置React Router，这样app.js将在应用内处理路由。

当前的设置

要建立我的路我已经创建routes.js，其中包含下面的代码：

var Router = require('react-router'); 
var Route = Router.Route; 

var routes = (
    <Route handler={App}> 
    <Route path="/" handler={home}/> 
    </Route> 
); 

module.exports = routes;

在app.js我导入路由加入RouteHandler，如文档中：

var React = require('react'); 
var Router = require('../routes.js'); 
var RouteHandler = Router.RouteHandler; 

var APP = React.createClass({ 
    render: function() { 
    return (
     <RouteHandler/> 
    ); 
    } 
}); 

module.exports = APP;

我无法理解文档中的这段代码：

Router.run(routes, Router.HashLocation, (Root) => { 
    React.render(<Root/>, document.body); 
});

既然我已经叫<app />组件从main组件我想处理所有的路由在app部件内。我认为上面的代码是通过Root转移handler={component_to_render}。但是，如何将app.js中的代码配置为将路线转移到<RouteHandler/>？

我的整个设置可能是错误的，所以任何指导将不胜感激。

来源

2015-08-28 rosnk

它应该工作，有什么问题？您不明白的语法是称为[ArrowFunction]的ES6语法（https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/Arrow_functions），它是编写'function（根目录）{return React.render（，document.body）}）' – Pcriulan

我从“主要组件”渲染“应用程序”组件，我打算在“主要”组件而不是“应用程序”组件中使用路线。为了进一步解释，我打算所有的路线来实现“主要”组件，并根据通过的路线呈现新组件。例如，如果这条路由被触发，我想在main.js.中加载“home”组件。现在我不知道Router.run的位置... 。代码去，我不打算在Router.run函数内使用React.render（，document.body），我只需要从routes.js中触发的任何路由实现app.js – rosnk

这不是完整的答案，但我注意到一个问题：你正在导入'routes.js'作为React Router，而不是在'app.js'中导入实际的React Router，你需要'require' React Router和独立的路由：'var Router = require（'react-router'）'和'var routes = require（'../ routes.js'）;'。 –

由于Router必须知道要呈现哪个组件，它必须是根组件。因此，而不是写...

React.render(<APP />, document.getElementById("main"));

...只是写：

Router.run(routes, Router.HashLocation, (Root) => { 
    React.render(<Root/>, document.getElementById("main")); 
});

当某些用户点击“/” URL时，<Root/>节点会使您APP处理这反过来会呈现您的HomeComponent。

来源

2015-08-28 12:35:25 Pcriulan

如果我使用 'React.render（，document.getElementById（“main”））;”在main.js中呈现应用程序中的应用程序组件。JS，现在我想渲染/（根）或app.js内的任何路线，但不是main.js。我有里面的app.js，但现在我怎么听URL和渲染组件内app.js.而且我也不能使用这段代码来监听url，因为这段代码有[document.getElementById（“main”））; ] 代码： Router.run（路线，Router.HashLocation，（根）=> { React.render（，的document.getElementById（ “主”））; }）; – rosnk

例如，假设您有一个“公共”应用程序和一个“管理员”应用程序，所以您需要不同的路线，这就是您想要的那种？ – Pcriulan

建立反应路由器的流量应用

当前的设置

回答

相关问题