使用React路由器重定向成功的ajax调用

下面的代码无法读取未定义的属性“router”

这个.transitiono（'home'）被窃听了，我猜这是因为它的上下文。我尝试将ajax调用绑定到这个函数，但也没有任何帮助

在这次成功的ajax调用之后，您有没有想过如何简单地重定向到“home”或“/”

我尝试了导航（transitionTo）和历史（this.pushState）的混合

编辑：在此期间，我发现了一个使用页面刷新的黑客工作解决方案。在ajax.done部分中：

history.pushState({},'','/')
window.location.reload()

代码：

var路由器=反应路由器；
var Route=ReactRouter.Route；
var Routes=ReactRouter.Routes；
var-Navigation=ReactRouter.Navigation；
var History=ReactRouter.History；
var Login=React.createClass({
mixins:[历史]，
mixins:[导航]，
getInitialState:函数（）{
返回{
电邮：“，
密码：“
}
},
提交：职能（e）{
e、 预防默认值（）
风险值数据={
电子邮件：this.state.email，
密码：this.state.password，
}
//通过jQuery/AJAX提交表单
$.ajax({
键入：“POST”，
url:“/sessions”，
数据：数据
})
.完成（功能（数据）{
应用程序登录（数据.电子邮件）
警报（'登录成功！'）
这个。过渡到（'home'））
//this.history.pushState（null，“/home”）
//this.pushState（null，“/home”）
})
.失败（功能（数据）{
警报（'没有此类电子邮件或密码不正确'）
});
},
handleEmailChange:函数（事件）{
this.setState（{email:event.target.value}）；
},
handlePasswordChange:函数（事件）{
this.setState（{密码：event.target.value}）；
},    
render:function（）{
返回(
登录到您的帐户


电邮：


密码：
提交
)
}
})

您的上下文在内部函数中发生变化。在我看来，解决这个问题最简单的方法是将

var\u this=this

放在外部函数中，然后在回调函数中使用

\u this.transitiono

您的上下文在内部函数中发生变化。在我看来，解决这个问题最简单的方法是将

var\u this=this

放在外部函数中，然后在回调函数中使用

\u this.transitiono

var Router = ReactRouter;
var Route = ReactRouter.Route;
var Routes = ReactRouter.Routes;
var Navigation = ReactRouter.Navigation;
var History = ReactRouter.History;

var Login = React.createClass({

mixins: [ History ],
mixins: [ Navigation ],

getInitialState: function(){
    return{
        email: "",
        password: ""
    }
},

submit: function(e){
    e.preventDefault()

    var data = {
       email: this.state.email,
       password: this.state.password,
    }

     // Submit form via jQuery/AJAX
    $.ajax({
        type: 'POST',
        url: '/sessions',
        data: data
        })
        .done(function(data) {
            App.logIn(data.email)
            alert('login successful!')
            this.transitionTo('home')
            // this.history.pushState(null, '/home')
            // this.pushState(null, '/home')
        })
        .fail(function(data) {
            alert('No Such Email or Incorrect Password')
        });
},

handleEmailChange: function(event) {
    this.setState({email: event.target.value});
},

handlePasswordChange: function(event) {
    this.setState({password: event.target.value});
},    

render: function(){
    return(
        <div>
            Login To Your Account
            <br/>
            <form onSubmit={this.submit} >
                Email: <input label="Email:" onChange={this.handleEmailChange} />
                <br/>
                Password: <input label="Password:" type="password" onChange={this.handlePasswordChange} />
                <button type="submit">Submit</button>
            </form>
        </div>
    )
}
})