Использование Golden-Layout с React Router

Я пытаюсь использовать 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)

Нужно ли модифицировать пример React для Golden-Layout, чтобы обернуть GoldenLayout

React.createClass({ })

внутри OptGrid (или любого другого компонента, который я хочу показать внутри), чтобы он мог обрабатываться как любой другой компонент? Или Golden-Layout предполагает, что он будет на верхнем уровне DOM, и в действительности поддерживает только вложенные компоненты React внутри него?

0 ответов

Другие вопросы по тегам