@aniki01

Почему реакт роутер ререндерит всё приложение?

Есть App файл
import React from 'react'
import Header from './Header'
import Main from './Main'

const App = () => (
  <div>
    <Header />
    <Main />
  </div>
)

export default App;


Header файл
import React from 'react'
import { Link } from 'react-router-dom'

const Header = () => (
  <header>
    <nav>
      <ul>
        <li><Link to='/'>Home</Link></li>
        <li><Link to='/Profile'>Profile</Link></li>
      </ul>
    </nav>
  </header>
)

export default Header


Main файл
import React from 'react'
import { Switch, Route } from 'react-router-dom'
import Home from './Home'
import Profilefrom './Profile'

const Main = () => (
  <main>
    <Switch>
      <Route exact path='/' component={Home}/>
      <Route path='/profile' component={Profile}/>
    </Switch>
  </main>
)

export default Main


Получается, что при переходе по любой ссылке у меня ререндерится App компонент вместе со всеми его детьми. Как этого избежать?
  • Вопрос задан
  • 61 просмотр
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы