在reactx应用程序中使用react-router重定向

Question

我正在尝试为使用react和redux构建的应用程序实现路由。我已经打包，以便路由处理程序可以访问该商店。但不知何故，我的路由逻辑不起作用。

这段代码是工作的罚款

export default class Root extends Component { 
 
    render() { 
 
    return (
 
     <Provider store={this.props.store}> 
 
     <div> 
 
      <App /> 
 
     </div> 
 
     </Provider> 
 
    ); 
 
    } 
 
}

但是，当我用下面的代码是不是showhing在我的本地任何更换。

export default class Root extends Component { 
 
    render() { 
 
    return (
 
     <Provider store={this.props.store}> 
 
     <div> 
 
     <Router> 
 
     <Route path="/" component={App} /> 
 

 
     </Router> 
 
     </div> 
 
     </Provider> 
 
    ); 
 
    } 
 
}

我试图找出我做错了。任何帮助将不胜感激。

Answer 1

我假设你的项目是基于浏览器的项目。因此，如果您的网站/应用托管在动态服务器上，则可以使用<BrowserRouter>。 你可以用它喜欢：

import {BrowserRouter, Route} from 'react-router-dom'; 

    export default class Root extends Component { 
     render() { 
     return (
      <Provider store={this.props.store}> 
      <div> 
      <BrowserRouter> 
      <Route path="/" component={App} />  
      <BrowserRouter> 
      </div> 
      </Provider> 
     ); 
     } 
    } 

，如果你的网站是由静态服务器化妆用的<HashRouter>

支持你可以阅读更多Here

Answer 2

我想你应该使用更高级别的路由器组件之一，如BrowserRouter。看看它是否有效：

return (
    <Provider store={this.props.store}> 
    <div> 
     <BrowserRouter> 
     <Route path="/" component={App} /> 
     </BrowserRouter> 
    </div> 
    </Provider> 
);