reactjs - 更改 URL 但仅在刷新后加载组件

Question

应用程序.js

const App = () => {     

  return (
    <div className='app-wrapper'>
        <BgVideo />  

        <Header /> 
        <Menu />
         <Switch>
            {routes.map((route, idx) => {
                return route.component ? (
                    <Route
                        key={idx}
                        path={route.pathname}
                        exact={route.exact}
                        name={route.name}
                        render={props => (
                            <route.component {...props} key={new Date().getTime()}/>
                        )}
                    />
                ) : null;
            })}
            <Redirect to={`/not-found`}/>
        </Switch>
    </div>
  );
};

索引.js

import React from 'react';
import ReactDOM from 'react-dom';
import {Router} from 'react-router';

import App from './App';
import { history } from './_helpers';

ReactDOM.render(
  <Router history={history}>
      <App />
  </Router>,
  document.querySelector('#root')
);

** 不能按预期工作。它会在单击时更改 URL，但仅在强制刷新页面后才加载我的组件。<BrowserRouter>工作正常，但我需要<Router>因为<BrowserRouter>忽略历史对象。

（我收到此警告消息： Warning: <BrowserRouter> ignores the history prop. To use a custom history, use import { Router } instead ofimport { BrowserRouter as Router } .）

PS 当我点击某个链接时，它第一次重定向到我的 Not-Found 页面，只有第二次它更改了 URL（不加载组件）。**

标签： reactjsreact-routerreact-router-domrouterhistory