定时器(setInterval)的开启与关闭

我设置的定时器是点击展示子组件的时候开启,等待30s后没有点击页面就关闭子组件,每次点击页面30s内没有点击也会关闭,当我点击退出子组件页面的时候也会关闭定时器

// 父组件展示子组件时开启定时器
this.$refs.manMachine.openOrCloseTime(true)

在子组件中定义定时器的名字以及用来计数的变量

 // 开启定时器
    openOrCloseTime(isOpen){
   // 父组件调用方法时传参来决定是否开启定时器
      if(isOpen==true){
        timer=setInterval(()=>{
          this.count--
          // 当计数变量值变为0时关闭定时器
          if(this.count==0){
           this.close(timer);
          }
        },1000)
      }else{
        this.close(timer);
      }
    },
    // 关闭定时器
    close(timer){
        clearInterval(timer);
     // 把计数变量恢复初始值,以供下次使用
        this.count=30;
     // 修改父组件传过来的控制子组件是否展示的变量值,来关闭子组件
        this.$emit("update:isChat", this.show);
      },

 在关闭页面的时候记得调用一下关闭定时器的方法

在对页面进行操作后,恢复计数变量初始值this.count=30,让定时器重新进行计时