Повторный рендеринг React Router при использовании стрелочной функции
У меня есть App.js с маршрутом
<Route path = "/home" component = {() => <Home changeAuth = {this.changeAuth} auth = {auth} />}/>
Но когда я использую компонент для отображения модального окна:
<Link to = "/home/info"> <span class = "logout">App Info</span></Link>
<Route path = "/home/info" component = {Info} />
Компонент был повторно отрисован и запущен componentDidMount.
Это не когда я использую <Route component = {Home}/>, но я хочу использовать реквизит.
Возможный дубликат передача настраиваемых реквизитов на маршрутизатор-компонент-в-реагирующем-маршрутизаторе-v4
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 1
В этом случае вы должны использовать свойство Route render, а не компонент:
<Route path = "/home" render = {() => <Home changeAuth = {this.changeAuth} auth = {auth} />}/>
PS: это зависит от версии реактивного маршрутизатора, который вы используете, поэтому я предполагаю, что вы используете v4
От Документация по компоненту маршрута:
When you use component (instead of render or children, below) the router uses React.createElement to create a new React element from the given component. That means if you provide an inline function to the component prop, you would create a new component every render. This results in the existing component unmounting and the new component mounting instead of just updating the existing component. When using an inline function for inline rendering, use the render or the children prop (below).
Можете ли вы сделать jsfiddle, но не можете решить свою проблему?