如何为React-Router路由器设置基本名称

时间:2018-08-01 17:45:55

标签: javascript reactjs react-router

我该如何配置基本名称,或在URL中保留类似localhost:8000/app的路径,当我不得不重定向到另一条路由时,路由器将这个/app标识为url的一部分,并且不要更改,这是我的组件结构。

import React from 'react';
import { Router, Route, browserHistory, IndexRoute } from 'react-router';
<Router history={browserHistory} >
  <Route component={App}>
    <Route path="/" component={Home} />
    <Route path="/login" component={LoginContainer} />
    <Route path="apresentacao">
      <IndexRoute component={NameContainer} />
      <Route path="2" component={HsContainer} />
      <Route path="3" component={McContainer} />
      <Route path="4" component={MpvContainer} />
    </Route>
  </Route>
</Router>

1 个答案:

答案 0 :(得分:1)

如果您使用的是React Router v4,则可以使用@csrf组件的basename属性来更改应用程序的基础。

Router

如果您使用的是React Router v3,则需要单独安装history软件包并使用import React from "react"; import { Router, Route, browserHistory, IndexRoute } from "react-router"; class App extends React.Component { render() { return ( <Router history={browserHistory} basename="/app"> <Route component={App}> <Route path="/" component={Home} /> <Route path="/login" component={LoginContainer} /> <Route path="apresentacao"> <IndexRoute component={NameContainer} /> <Route path="2" component={HsContainer} /> <Route path="3" component={McContainer} /> <Route path="4" component={MpvContainer} /> </Route> </Route> </Router> ); } } 函数。

useBasename