React路由器始终显示索引路线

vawmfj5a  于 2022-10-15  发布在  React
关注(0)|答案(0)|浏览(111)

这是我的主应用程序文件:

import React from 'react';
import { render } from 'react-dom';
import { browserHistory, Router, Route, IndexRoute } from 'react-router';

// Components
import Main from './components/core/Main.component';
import NotFound from './components/core/NotFound.component';
import About from './components/About.component';
import TeaTimer from './components/TeaTimer.component';

// App css
require('style!css!sass!applicationStyles');

render(
    (<div>
      <Router history={browserHistory}>
        <Route component={Main} path="/">
          <IndexRoute component={TeaTimer} />
          <Route component={About} path="/about"/>
        </Route>
        <Route component={NotFound} path="*"/>
      </Router>
    </div>),
    document.querySelector('#app')
);

这是我的主要组件:

import React, { Component } from 'react';

class Main extends Component {
  render() {
    return (
        <div>
            {this.props.children}
        </div>
    )
  }
}

Main.propTypes = {
  children: React.PropTypes.object
}

export default Main;

这是我的Express服务器设置:

var express = require('express');

// Create our app
var app = express();
const PORT = process.env.PORT || 3000;

app.use(function (req, res, next){
  if (req.headers['x-forwarded-proto'] === 'https') {
    res.redirect('http://' + req.hostname + req.url);
  } else {
    next();
  }
});

app.use(express.static('public'));

app.listen(PORT, function () {
  console.log('Express server is up on port ' + PORT);
});

现在,当我打开浏览器并转到http://localhost:3000时,我得到了TeaTimer组件。http://localhost:3000/#/相同,http://localhost:3000/#/about相同,未定义的路由-http://localhost:3000/#/sdnaipwnda[j相同。
但当我转到http://localhost:3000/about时,我得到的是:
无法获得/关于
我做错了什么?
如果您需要更多信息,请提问,我会将其添加到问题中,或者查看此git repo

暂无答案!

目前还没有任何答案,快来回答吧!

相关问题