React Router Ссылки представляют собой компоненты двойной рендеринга

Question

Соединения React Router представляют собой компоненты двойной рендеринга. Может ли кто-нибудь повторить мои результаты ниже:

При первой загрузке страницы вы получите сообщение «RENDERING HOME», зарегистрированное один раз. Но с помощью ссылок всегда будет дважды записываться строка «RENDERING».

import ReactDOM from 'react-dom'; 
import React from 'react'; 
import { Router, Route, Link, IndexRoute, hashHistory, browserHistory } from 'react-router'; 


class home extends React.Component { 
    render(){ 
     console.log('RENDERING HOME'); 
     return(
      <Link to='destination'>Link to Destination</Link> 
     ) 
    } 
} 

class destination extends React.Component { 
    render(){ 
     console.log('RENDERING DESTINATION'); 
     return(
      <Link to='/'>Link to Home</Link> 
     ) 
    } 
} 

var App = React.createClass({ 
    render: function() { 
     return(
      <Router history={hashHistory}> 
       <Route path='/' component={home}/> 
       <Route path='destination' component={destination}/> 
      </Router> 
    ); 
    }, 
}); 


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

EDIT: Это, как представляется, ошибка, другие отмечали его на среагировать-маршрутизатор GitHub. Его единственная ошибка с hashHistory. Переключение на browserHistory решает проблему.

Answer 1

Проблема с hashHistory, пожалуйста, обратитесь к этой ссылке: https://github.com/ReactTraining/react-router/issues/4266

Для решения на данный момент, подумайте о том, как использовать browserHistory, и все будет хорошо.

Answer 2

вам необходимо изменить маршрутизатор. добавить/в пункт назначения

<Router history={hashHistory}> 
       <Route path='/' component={home}/> 
       <Route path='/destination**' component={destination}/> 
    </Router> 

добавить маршрут назначения внутри корневого маршрута

<Router history={hashHistory}> 
     <Route path='/' component={home}> 
      <Route path='destination**' component={destination}/> 
     </Route> </Router>