Question

我现在正在创建自己的博客，并在react-router-dom中使用react。当我直接在地址栏中输入除“ /”以外的网址时，我在Chrome中收到“无法获取/ url”错误。但是localhost：8000 /正常工作。例如）localhost：8000 / favorite ==>无法获取/ favorite

然后单击标题和重定向即可。仅在地址栏中输入是无效的。

下面简化了我的代码结构。

index.js

const rootElement = document.getElementById('root');
ReactDOM.render(
   <BrowserRouter>
       <App />
   </BrowserRouter>
, 
rootElement);

App.js

class App extends React.Component {
    render(){

        return (
            <div>
                <Header/>
                <Main></Main>
            </div>
        );
    }
}

export default App;

Main.js

const Main = () => (
  <main>
    <Switch>
      <Route exact path='/' component={HomeContainer}/>
      <Route path='/post' component={Post}/>
      <Route path='/favorite' component={Favorite}/>
      <Route path='/setting' component={Setting}/>
    </Switch>
  </main>
)

export default Main

header.js

<div>
    <Menu.Item><Link to='/'><Icon onClick={this.clickMenu} name='home' data- name='home' size="large"/></Link></Menu.Item>
    <Menu.Item><Link to='/post'><Icon onClick={this.clickMenu} name='list'data-name='list' size="large"/></Link></Menu.Item>
    <Menu.Item><Link to='/favorite'><Icon onClick={this.clickMenu} name='favorite' data-name='favorite' size="large"/></Link></Menu.Item>
    <Menu.Item><Link to='/setting'><Icon onClick={this.clickMenu} name='settings' data-name='settings'size="large"/>/Link></Menu.Item>

</div>

无法直接按地址连接页面

0 个答案: