反应路由器不工作

Question

我有一个简单的反应路由器设置。请在此处查看我的代码 -

https://github.com/rocky-jaiswal/lehrer-node/tree/master/frontend

这是 react-router 最基本的设置，但是在浏览器中我无法让它工作 -

import React from 'react';
import ReactDOM from 'react-dom';
import { Router, Route } from 'react-router';
import IndexContainer from './components/index-container';
import AboutContainer from './components/about-container';
import PagesContainer from './components/pages-container';

(function main() {
  ReactDOM.render((
    <Router>
      <Route path="/" component={IndexContainer}>
        <Route path="about" component={AboutContainer} />
        <Route path="pages" component={PagesContainer} />
      </Route>
    </Router>),
    document.getElementById('app')
  );
})();

问题还在于控制台没有报错。即使我更改了 URL，IndexComponent 也总是挂载的。另外，如果我以某种方式键入 http://localhost:3333/#/about it changes to http://localhost:3333/#/about?_k=bac2pt 并停留在 IndexComponent.

我的简单 webpack 配置或 react / react-router 版本有问题吗？

谢谢，洛基

Answer 1

IndexContainer 是您的父组件，请尝试在您的 render() 中添加 { this.props.children }，以便显示 AboutContainer 和 PagesContainer。

反应路由器不工作

React router not working

javascript

reactjs

react-router