React Router: ничего не видно на странице

Я пытаюсь создать приложение React, но у меня проблема: при попытке загрузить главную страницу ошибки не будут выброшены, но на странице ничего не отображается ,React Router: ничего не видно на странице

Точка входа приложения является main.js, который имеет это в render метод:

React.render((
    <Router history={history}> 
    <Route component={RootComponent}> 
     <Route path="/page1" component={Page1}></Route> 
     <Route path="/page2" component={Page2}></Route> 
    </Route> 
    </Router> 
), document.body);

Метод RootComponent.jsrender выглядит следующим образом:

render() { 
    return (
    <div className="navContainer"> 
     <Menu onMenuChange={::this._onMenuChange} ref="slidemenu" alignment="left"> 
     <MenuItem hash="/page1">Dash Board</MenuItem> 
     <MenuItem hash="/page2">Create Deal</MenuItem> 
     </Menu> 
     <div className={this.state.expand ? 'slidebody' : 'shrinkbody'}> 
     <span className="menuIcon" onClick={this.showLeft}>&#9776;</span> 
     {this.props.children} 
     </div> 
    </div> 
); 
    }

Остальные компоненты простые компоненты. Как я уже упоминал, ошибок нет, но приложение ничего не показывает. Это то, что на самом деле оказывается в браузере:

<body> 
    <noscript data-reactid=".0"></noscript> 
</body>

Я использую "реагировать": "^ 0.13.3" и "реагировать-маршрутизатор": "^ 1.0.0-beta3".

Почему ничего не найдено на странице? Как я могу это исправить?

источник

2015-10-01 sapy

(Никто не действительно собирается быть в состоянии решить эту проблему для вас без рабочего Fiddle/CodePen, который включает в себя * все * из компонентов, как проблема может быть в любом из них. Кроме того, попробуйте выполнить рендеринг ваших компонентов за пределами маршрутизатора и посмотрите, не выдают ли они ошибку, которую вы можете видеть, когда они являются отдельными.) – XML

Хорошо, вот вся база кода https://github.com/sap9433/change-slide-menu. – sapy

Я немного отлаживал и нашел, что компонент Rendering вне маршрутизатора работает нормально. Но с указанной выше структурой метод RootComponent никогда не вызывался. поэтому актуальной проблемой является то, что RootComponent не получает визуализацию. – sapy

Добавить путь к пути для RootComponent:

React.render((
<Router path="/" history={history}> 
<Route component={RootComponent}> 
    <Route path="/page1" component={Page1}></Route> 
    <Route path="/page2" component={Page2}></Route> 
</Route> 
</Router> 
), document.body);

источник

2016-08-17 13:45:50 bhattshru

React Router: ничего не видно на странице

ответ

Смежные вопросы