セマンティックUIサイドバー。反応ルータがそのコンポーネントを再レンダリングさせるプッシャー

Question

私は反応ルータとセマンティックUIサイドバーを使用しています。サイドバーが表示と非表示の間で切り替わると、ルーターはそのコンポーネント（OilBarrelComponent）を（ 'プッシュ'ではなく）再作成するようにトリガーします。これは不要と思われ、私が望まない副作用があります。サイドバーを切り替えるだけで、OilBarrelContainerコンポーネントが再作成される原因となっているコードに問題がありますか？

import {BrowserRouter as Router, Route, Link, Switch} from 'react-router-dom'; 
import {Sidebar, Segment, Button, Menu, Icon} from 'semantic-ui-react' 

    toggleSidebarVisibility =() => this.setState({ sidebarVisible: !this.state.sidebarVisible }) 

    render() { 
    const { sidebarVisible } = this.state 

    return (
    <Router history={history}> 
     <div> 
     <Sidebar.Pushable className="phsidebar" as={Segment}> 
      <Sidebar as={Menu} animation='push' width='thin' visible={sidebarVisible} icon='labeled' vertical inverted> 
      <Menu.Item className="sidebaritem" as={Link} to='/oilbarrel'> 
       Gauge 
      </Menu.Item> 
      </Sidebar> 
      <Sidebar.Pusher> 
      <div> 
       <MessagesContainer/> 
       <Switch> 
       <Route exact path="/" component={() => (<Home />)}/> 
       <Route exact path="/oilbarrel" component={() => (<OilBarrelContainer timer={true} topMargin={0} width={300} height={400} labelText={"Diesel"}/>)}/> 
       </Switch> 
      </div> 
      </Sidebar.Pusher> 
     </Sidebar.Pushable> 
     </div> 

    </Router> 
    )}; 

Answer 1

私はそれがあなたの<Route>のcomponent小道具の機能ではなく、コンポーネントのクラスにだけ言及していることだと思います。

I.e.代わりに

component={() => (<Home />)} 

の私はそれは私がすべての上の再描画全く新しいコンポーネントの元の方法はレンダリングし、それにより再を主張するように反応するために方法がないと信じて

component={Home} 

あるべきと考えていますレンダリングは不要です。