Question

constructor(){
    super()

    this.state = {
        countDown: 6
    }}
componentDidMount(){

    this.myInterval = setInterval(() =>{
        browserhistory.push("/time-up")componentDidUpdate(){
    if(this.state.countDown === 0){
      browserHistory.push("/time-up");
}
}

///我想在componentDidUpdate生命周期的倒计时为零时将用户重定向到一个名为“超时”的页面。

Answer 1

添加browserHistory.push("/time-up");代替window.location = "/time-up"

Answer 2

您正在尝试重定向到/ time-up，所以我想您正在尝试进行内部导航。您可以通过使用来自react-router的历史记录道具来做到这一点

您可以写browserHistory.push("/time-up");代替this.props.history.push("/time-up")

如果您没有历史记录道具，则可以通过添加withRouter HOC来扩充组件来进行注入

Answer 3

要从componentDidUpdate()重定向，请使用

componentDidUpdate(){
    if(this.state.countDown === 0){
       window.location.href = "/time-up"
    }
}

另一种方法是使用react-router-dom包中的Redirect，

import { Redirect } from 'react-router-dom';

componentDidUpdate(){
    if(this.state.countDown === 0){
       <Redirect to={'/time-up'} />
    }
}

注意：您的代码段很杂乱，您在componentDidUpdate内使用componentDidMount吗？如果是，那么您不应该这样做。两者是不同的方法，不能在另一个内部调用，请以不同的方式放置。

Answer 4

您需要减少时间，否则它将停留在6

倒数计时器为0时，如何将使用者重新导向到另一个页面？

4 个答案: