Javascript 在三次登录尝试失败时重定向的计数器不起任何作用

我正在尝试在我的React应用程序中创建一个计数器，如果服务器（Expressjs）在pin上发送status false，则该计数器将重定向尝试3次，我已通过控制台日志验证该状态是否确实已发送，这是chrome控制台中的visibible。但由于某些原因，我的应用程序没有重定向。我正在尝试使用

this.props.history.push和React返回中的条件呈现重定向。要计算我在构造函数中定义的
尝试次数
，并将每次失败尝试的次数增加1，如果该值大于3，我希望重定向到其他页面。这是我的react前端代码（我删除了导入）：

类登录扩展了React.Component{
构造函数（）{
超级（）；
此.state={
卡号：''，
pin:“”，
服务器卡号：{
消息：“”，
状态：“”，
尝试次数：0
}
};
this.handleSubmit=this.handleSubmit.bind（this）；
}
handleEvent=e=>{
this.setState（{[e.target.name]：e.target.value}）；
};
handleSubmit=async e=>{
e、 预防默认值（）；
//将表单数据移出状态
const{cardnumber，pin}=this.state；
常量数据={cardnumber，pin}；
const url='/api/login'；
const serverResponse=等待获取（url{
方法：“POST”，
标题：{
接受：'application/json'，
“内容类型”：“应用程序/json”，
“访问控制允许来源”：“*”，
“访问控制允许凭据”：true
},
正文：JSON.stringify（数据）
});
const json=await serverResponse.json（）；
log（json）；
log（'json状态为：'，json.status）；
if（json.status==false）{
this.state.tries++；
}
如果（this.state.trys<3）{
this.state.trys=false；
this.props.history.push（'/selectaction'）；
}
这是我的国家(
prevState=>{
setItem（'cardnumber'，json.message）；
log（'json状态为：'，json.status）；
返回{
servercardnumber:json.message，
状态：json.status
};
},
() => {
console.log（this.state.cardnumber）；
}
);
};
render（）{
const{cardnumber，pin，status，trys}=this.state；
返回(
{尝试？！：空}
{console.log（'服务器说：'）}
{console.log（状态）}
{/*https://material-ui.com/style/css-baseline */}
登录


{/*Bytt ut med CSS块元素eller noe slikt，Bytt名称påform fields tilåhentes via JS*/}
{
e、 target.value=Math.max（0，parseInt（e.target.value））
.toString（）
.切片（0,12）；
}}
onChange={e=>this.handleEvent（e）}
/>


{
e、 target.value=Math.max（0，parseInt（e.target.value））
.toString（）
.切片（0,4）；
}}
onChange={e=>this.handleEvent（e）}
/>




登录

Cardnumber:{this.state.Cardnumber}

pin码：{this.state.pin}


);
}
}
导出默认登录；

有什么想法吗
 首先，在初始状态下，
尝试
键嵌套在
服务器卡号
键下，您试图在状态下直接访问它。
然后增加它，因此：

a） 你可以直接改变状态，这是不应该的

b） 若对象上不存在键，并且您尝试递增它，则将获得
NaN
作为该键的值

因此，在该操作之后，您现在有了
this.state.trys
，但设置为
NaN
，它将永远不会小于3（我认为您在这里的意思是“大于”），但即使是，您也可以将
trys
键设置为false（再次直接设置）-第二次尝试时，增加false将导致0，因此，在尝试次数超过您想要的次数后，您将被重定向。
固定初始状态后：

  this.state = {
    tries: 0,
    cardnumber: '',
    pin: '',
    servercardnumber: {
      message: '',
      status: '',
    }
  };

还有你的处理器，为了简洁起见省略了一些部分：

handleSubmit = async e => {
    const {tries} = this.state
    // ...
    if (json.status === false) {
      this.setState(prevState => ({tries: prevState.tries + 1}, () => {
        if (tries >= 3) {
          this.props.history.push('/selectaction');
          return
        }
      })
    }
    // ...
    );
  };

在处理程序中有三件事发生了变化——如果您想在setState中使用前一个状态，您应该传递一个函数。若您想做一些依赖于首先更改的状态的事情，可以在作为第二个可选参数传递给setState的回调函数中完成。最后，返回end executing函数（我假设如果json.status第三次为false，您不想做任何其他事情，只需重定向）
通过将尝试移出构造函数中的数组，它现在计算第一次的次数，但在第一次尝试后将其设置为“false”（因此，在它达到1后，它将设置为false）
handleSubmit = async e => {
    const {tries} = this.state
    // ...
    if (json.status === false) {
      this.setState(prevState => ({tries: prevState.tries + 1}, () => {
        if (tries >= 3) {
          this.props.history.push('/selectaction');
          return
        }
      })
    }
    // ...
    );
  };