用React Router路由目錄

Question

我以前在/home有主頁。 我想將其遷移到基本URL / 。

當我做的時候

<Route
    path="home"         
    component={HomePage}
/>

我可以在localhost/home訪問頁面

如果我想使用基本目錄，我會得到一個空白頁，

<Route
    path=""         
    component={HomePage}
/>

和（以防萬一）

<Route
    path="/"            
    component={HomePage}
/>

App.js也接收到空的props.children ，盡管我只發送一個空字符串作為路徑名，其余的保持不變。

該應用程序呈現的是這個

render() {
  return (
    <div>
      {this.props.children}
    </div>
  );
}

如果路線不是空字符串，則props子項將充滿鍵，props，type等屬性

Answer 1

如果只有一條路由而沒有其他路由，則該代碼應該沒問題。 如果您還有其他路線，則該代碼將開始出現問題，因為path ='/ about'或path ='/ info'全部包含'/'，因此至少對於基本路線而言，必須使用精確路徑。 或者，您也可以使用switch來匹配它找到的第一個路線，但是我只是堅持手頭的問題。

//routes.js

const App = () => (
  <Router>
    <div>
      <Route exact path="/" component={Component1}/>
      <Route exact path="/about" component={Component2}/>
    </div>
  </Router>
)

導出默認應用程序；

//render.js

ReactDOM.render(<App />, document.getElementById('root'));

這應該可以，但是如果沒有請回復。 照顧自己！