Настройка начального маршрута с помощью реактивного маршрутизатора

Question

У меня возник вопрос о настройке начальных маршрутов с помощью реактивного маршрутизатора (в сочетании с Redux). У меня есть несколько маршрутов, настроенных и основанных на состоянии из моего магазина Redux. Мне нужно всегда перенаправлять пользователя на определенный маршрут при загрузке страницы.

Путь мои маршруты в настоящее время созданы следующим образом:

<Provider store={store}> 
    <Router history={history}> 
     <Route path="/" component={App} onEnter={redirectToInitialRoute}> 
      <Route path="/send" component={OverviewPage} /> 
      <Route path="/thanks" component={ConfirmPage} /> 
      <Route path="/:categoryIdentifier" component={CategoryPage} /> 
     </Route> 
    </Router> 
</Provider> 

я добавил функцию OnEnter на мой корневой маршрут. Я сделал это, так как мне всегда нужно перенаправлять на загрузку страницы, независимо от того, на какую страницу пользователь вводит приложение. Путь моя функция OnEnter настроена следующим образом:

function redirectToInitialRoute (nextState, replace) { 
    if (condition) { 
     replace('/send'); 
    } 
    else if (anotherCondition) { 
     replace('/thanks'); 
    } 
} 

Однако то, что происходит с этой установкой, является то, что (например) «anotherCondition» выполняется и перенаправляет на '/ спасибо. Поскольку onEnter передается по корневому маршруту, redirectToInitialRoute запускается снова. Поскольку «anotherCondition» по-прежнему верен, перенаправление происходит снова, вызывая цикл переадресации.

Мне было интересно, что было бы лучшим способом решить эту проблему? Любая помощь приветствуется. Заранее спасибо!

Answer 1

Как насчет добавления маршрута указателя, а затем перенаправления на mount?

<Provider store={store}> 
    <Router history={history}> 
     <Route path="/" component={App} onEnter={redirectToInitialRoute}> 
      <IndexRoute component={Welcome} />   
      <Route path="/send" component={OverviewPage} /> 
      <Route path="/thanks" component={ConfirmPage} /> 
      <Route path="/:categoryIdentifier" component={CategoryPage} /> 
     </Route> 
    </Router> 
</Provider> 

Затем в Welcome компонента:

componentDidMount: function() { 
    if (condition) { 
     browserHistory.push('/here'); 
    } else { 
     browserHistory.push('/there'); 
    } 
}