加入收藏 | 设为首页 | 会员中心 | 我要投稿 南京站长网 (https://www.025zz.com.cn/)- 自然语言处理、建站、经验、云计算、图像分析!
当前位置: 首页 > 教程 > 正文

react如何关掉页面时间

发布时间:2023-07-05 12:00:36 所属栏目:教程 来源:未知
导读:   这篇文章主要介绍“react如何关闭页面时间”,在日常操作中,相信很多人在react如何关闭页面时间问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家
  这篇文章主要介绍“react如何关闭页面时间”,在日常操作中,相信很多人在react如何关闭页面时间问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”react如何关闭页面时间”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!
 
  react设置关闭页面时间的方法:1、在constructor中设置5秒的时间值;2、在componentDidMount中添加定时器;3、在render中添加判断即可,代码如“<Result status="403"title="403"subTitle="..."extra={<Button>{this.state.dlgTipTxt}</Button>}/>”。

  首先在constructor中设置5秒的时间值
 
  constructor (props) {
 
     super(props)
 
     this.state={
 
       seconds: 5,
 
       dlgTipTxt: '5s后关闭页面'
 
     };
 
   }
 
  componentDidMount中添加定时器
 
  componentDidMount () {
 
    let timer = setInterval(() => {
 
      this.setState((preState) =>({
 
        seconds: preState.seconds - 1,
 
        dlgTipTxt: `${preState.seconds - 1}s后自动关闭`,
 
      }),() => {
 
        if(this.state.seconds == 0){
 
          clearInterval(timer);
 
          window.close()
 
        }
 
      });
 
    }, 1000)
 
  }
 
  render中添加判断
 
  render() {
 
  return (
 
  <Result
 
  status="403"
 
  title="403"
 
  subTitle="抱歉你没有权限访问页面"
 
  extra={
 
  <Button>
 
  {this.state.dlgTipTxt}
 
  </Button>
 
  }
 
  />
 
  )
 
  }
 

(编辑:南京站长网)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章