Question

我想为我的路由分配一个基本名称，我可以使用BrowserRouter。

我还想指定自定义历史记录，以便以编程方式导航我的用户。我可以使用路由器做什么。

但是，我不能同时做到这两点。是否有可能扩展其中一个路由器以支持此功能，或者将其包围函数来添加它？

我目前的设置是这个 -

import React from 'react';
import { Router, Switch, Route, Redirect } from 'react-router-dom';

import createHistory from './history';

import Navigation from './components/navigation/Navigation';

import PrivateRoute from './components/private-route/PrivateRoute';

import Home from './containers/home/Home';
import PageTwo from './components/pageTwo/PageTwo';
import Callback from './components/callback/Callback';
import Login from './components/login/Login';

export default () => (
  <Router history={createHistory}>
    <div>
      <Navigation />
      <Switch>
        <Route path="/callback" component={Callback} />
        <Route path="/login" component={Login} />
        <PrivateRoute path="/" exact component={Home} />
        <PrivateRoute path="/page-two" component={PageTwo} />
        <Redirect to="/" />
      </Switch>
    </div>
  </Router>
);

但是我很想实现像 -

这样的东西

<Router history={createHistory} basename="foo">

Answer 1

You can：

history

或直接配置import { Router } from 'react-router'; import createBrowserHistory from 'history/createBrowserHistory'; const history = createBrowserHistory({ basename: '/your/app' }); <Router history={history}> <App /> </Router>对象：

{{1}}

React Router v4 baseName和自定义历史记录

1 个答案: