react中withRouter报错。

Question

已经将Router写在外面怎么还是报错

// index.js
import ReactDOM from 'react-dom';
import './scss/index.scss';
import App from './App'
import {
  BrowserRouter,
} from "react-router-dom";

ReactDOM.render(
  <BrowserRouter>
    <App />
  </BrowserRouter>,
  document.getElementById('root')
);

// App.js
import './scss/App.scss';
import React, { Component } from 'react'
import Home from './views/home'
import { Route, Switch, withRouter } from 'react-router-dom';

class App extends Component {
  render() {
    console.log(this.props.history);

    return (
      <div>
        <button onClick={e => this.pushToProfile()}>我的</button>

        <Switch>
          <Route exact path="/" component={Home} />
        </Switch>
      </div>
    )
  }

}

export default withRouter(App);

Uncaught Error: Invariant failed: You should not use <withRouter(App) /> outside a <Router>

Answer 1

index.js 改成这个写法：

<BrowserRouter basename='/'>
            <Route path={`/`} component={App}></Route>
        </BrowserRouter>