有了反應，路由器終極版，如何以編程方式重定向到URL

Question

如何以編程方式重定向到給定的URL以下軟件包：

"react-dom": "^15.5.4", 
"react-redux": "^5.0.4", 
"react-router-dom": "^4.1.1", 
"react-router-redux": "^5.0.0-alpha.6", 

我有這樣的工作：

import React from 'react'; 
import createBrowserHistory from 'history/createBrowserHistory'; 

class WorkPlacePage extends React.Component { 
    render() { 
    const history = createBrowserHistory(); 
    return (
     <div> 
     <button onClick={() => history.push('/welcome/skills')}>next page</button> 
     </div> 
    ); 
    } 
} 

export default WorkPlacePage; 

的上面的問題是，當瀏覽器的URL發生更改時，反應應用程序似乎不會將URL更改視爲重定向。應該由URL觸發的反應應用程序組件從未運行反應組件邏輯的方式，如果url被刷新...

如何以編程方式觸發URL重定向，其中的React應用程序加載新的網址？

謝謝！

Answer 1

如果使用較新的反應路由器API，你需要利用歷史從this.props時組件，以便內部：

this.props.history.push('/some/path'); 

然而，這僅可用於以編程方式更改URL，不實際導航到該頁面。你應該像這樣在你的路由器配置文件裏把組件映射到這個URL。

<BrowserRouter> 
     <div> 
     <Switch> 
      <Route path="/some/path" component={SomeComponent} /> 
      <Route path="/" component={IndexComponent} /> 
     </Switch> 
     </div> 
</BrowserRouter> 

希望這會有所幫助。快樂編碼！