3

我正在尝试将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'>
        &nbsp;
        </div>
    </div>
)}
});

ReactDOM.render((
  <Router history={browserHistory}>
    <Route path="/" component={App}>
      <Route path="/about" component={About} />
      <Route path="/ogrid" component={OptGrid} />
    </Route>
  </Router>
), root)

我是否需要修改Golden-Layout 的 React 示例以将 GoldenLayout 包装为

React.createClass({ })

在 OptGrid 内部（或我想在内部显示此布局的任何组件），以便可以像任何其他组件一样处理它？或者 Golden-Layout 是否假定它位于 DOM 的顶层，并且仅真正支持在其中嵌套 React 组件？

4

0 回答 0