Я хотел создать логин Facebook в мой реагировать/реагировать-маршрутизатор/поток приложение.
У меня есть слушатель регистрируется на событие логина и хотите перенаправить пользователя на '/панель'
если они вошли в систему. Как я могу это сделать? расположение.нажимаем` ничего'т работу очень хорошо, за исключением после перезагрузки страницы полностью.
реагировать маршрутизатор В3
Это то, что я делаю
var Router = require('react-router');
Router.browserHistory.push('/somepath');
реагировать маршрутизатор В4
Теперь мы можем использовать `<переадресация> компонент в маршрутизатор реагировать В4.
Визуализация в <переадресация>
будут перемещаться на новое место. Новое местоположение будет переопределить текущее местоположение в стеке истории, как серверные редиректы.
import React, { Component } from 'react';
import { Redirect } from 'react-router';
export default class LoginComponent extends Component {
render(){
if(this.state.isLoggedIn === true){
return (<Redirect to="/your/redirect/page" />);
}else{
return (<div>Login Please</div>);
}
}
}
Документации https://reacttraining.com/react-router/web/api/Redirect
реагировать маршрутизатор версии v0.13
В "маршрутизатор" экземпляр вернулся из маршрутизатора.создать` можно передать по кругу (или, если внутри реагируют компоненту, вы можете получить его контекст объекта), и содержит методы какtransitionTo
, которые можно использовать для перехода на новый маршрут.
реагировать маршрутизатор П2
Хотя на вопрос уже ответил, Я думаю, что это'ы отношение к посту решение, что работал для меня, так как это было'т покрывается в любом из решений, принятых здесь.
Во-первых, я'м, используя контекст маршрутизатор на моем LoginForm
, который компонент
LoginForm.contextTypes = {
router: React.PropTypes.object
};
После этого, я могу получить доступ к объекту маршрутизатор
в моей LoginForm
, который компонент
handleLogin() {
this.context.router.push('/anotherroute');
}
ЗЫ: работает на реагировать-маршрутизатор версии 2.6.0
реагировать маршрутизатор В3
создать свое приложение с маршрутизатором, как это
// Your main file that renders a <Router>:
import { Router, browserHistory } from 'react-router'
import routes from './app/routes'
render(
<Router history={browserHistory} routes={routes} />,
mountNode
)
Где-то вроде промежуточного обертывание или поток действия:
import { browserHistory } from 'react-router'
// Go to /some/path.
browserHistory.push('/some/path')
// Go back to previous location.
browserHistory.goBack()
маршрутизатор реагировать В4.2.0
Я использую реагировать-16.2.0 & реагировать-маршрутизатор-4.2.0
И я получаю решение на этот код
этот.реквизит.история.толчок (на"/" - а);
Мой рабочий код:
.затем(ответ => ответ.формат JSON()) .затем(данные => { если(данные.статус == 200){ это.реквизит.история.нажимаем (на"/" - а); консоль.журнал('успешно логин'); } })
Я был следующим этот документ перенаправить на вход-и-выход
Я тоже была попробовать по возвращении <перенаправление='/' />` но не повезло, это не работает для меня.
реагировать маршрутизатор В3
Навигация внутри компоненты
Вы должны использовать withRouter
декоратор, когда он'ы, необходимые для перенаправления внутри компонента. Декоратор использует контексте вместо вас.
import {withRouter} from 'react-router'
fucntion Foo(props) {
props.router.push('/users/16');
}
export default withRouter(Foo);
withRouter(компонент, [параметры])
в специальных (высших порядков компонент), который обертывает другой компонент для повышения ее реквизита с реквизитом маршрутизатор.
withRouterProps = { ...componentProps, маршрутизатор, параметры, расположение маршруты }
пройти в ваш компонент, и он будет возвращать завернутый компонента.
вы можете точно указать роутер как опору для компонента обертке переопределить Object маршрутизатор из контекста.
В вашем магазине:
data.router.transitionTo('user');
И маршрутизатор:
в "маршрута наименование=то"пользователей" в обработчик={пользователь}"
в
Пользователь обработчик маршрута