我试图将Golden-Layout与React Router 2.6.1结合使用,但我很难弄清楚如何在我创建的包装中嵌入Golden-Layout用于我的路由器。
import React from 'react';
import ReactDOM from 'react-dom';
import { Router, Route, Link, browserHistory } from 'react-router'
import OptGrid from './containers/OptGrid';
import About from './components/About';
import NoMatch from './components/NoMatch';
import './index.css';
const App = React.createClass({
render: function() {
return (
<div className='flexbox-parent flex-column'>
<div className='flexbox-item header'>
<ul>
<li><Link to={`/home`} className='menu_item'>Home</Link></li>
<li><Link to={`/ogrid`} className='menu_item'>OGrid</Link></li>
</ul>
</div>
<div className='flexbox-item fill-area content flexbox-item-grow'>
{this.props.children}
</div>
<div className='flexbox-item footer'>
</div>
</div>
)}
});
ReactDOM.render((
<Router history={browserHistory}>
<Route path="/" component={App}>
<Route path="/about" component={About} />
<Route path="/ogrid" component={OptGrid} />
</Route>
</Router>
), root)
我是否需要修改React example of Golden-Layout以使用
包装GoldenLayoutReact.createClass({ })
在OptGrid里面(或者我想在里面显示这个布局的任何组件),以便它可以像任何其他组件一样处理?或者Golden-Layout是否假定它位于DOM的顶层,并且只支持在其中嵌套React组件?