Почему при оборачивании компонента в функцию connect перестают работать роуты?

Question

[Sanchik97]

Добрый день! Есть компонент App, в котором содержатся роуты. При оборачивании этого компонента в функцию connect из react-redux перестают работать роуты. Точнее они срабатывают, но рендер компонента происходит только после перезагрузки страницы. Как можно решить данную проблему?

import React, { Component } from 'react'
import './App.css'
import { Route, Switch } from 'react-router-dom'
import Scripts from '../Scripts/Scripts'
import Layout from '../../hoc/Layout/Layout'
import ViewScript from '../ViewScript/ViewScript'
import Admin from '../Admin/Admin'
import AddNewScript from '../AddNewScript/AddNewScript'
import Page404 from '../../components/Page404/Page404'
import {connect} from 'react-redux'

class App extends Component {
	render() {
		return (
			<Layout>
				<Switch>
					<Route exact path="/" component={Scripts} />
					<Route path="/viewscript/:id" component={ViewScript} />
					<Route path="/admin" exact component={Admin} />
					<Route path="/admin/addnewscript" component={AddNewScript} />
					<Route path="*" component={Page404}/>
				</Switch>
			</Layout>
		)
	}
}

export default connect()(App)

Вот сам компонент App

Answer 1

[Demian Smith]

import { withRouter } from 'react-router-dom'
...
export default withRouter(connect()(App))