VUE 定时器

背景：

                   需要实现 输入登录账号密码后进行二维码扫描登录，因此需要定时轮询后端的扫描结果

 JS代码：

<script>
export default {
  data() {
    return {
      QR:'',//二维码
      userId:'',
      wxid:'',
      timer:'',
    }
  },
  methods: {
    submitForm(formName) {
            let url = `验证登录账号密码的  接口`
            let data = {};
            this.$post(url, data).then(retData => {
              if (retData.code == 1) {
                    // 登录成功后 生成二维码
                    let url = `生成二维码 接口`;
                    let data = {
                          user_id:this.userId,
                          open_id:this.wxid,
                    }
                    this.$post(url, data).then(ret => {
                      if(ret.code == 200){
                        // 获取到 二维码
                        //将 二维码绘画到  页面上
                        this.QR = ret.data.qrCodeUrl;
                        
                        // 设置定时器
                        this.timer = setInterval(()=>{ 

                            // 轮询调用 扫描二维码 的结果 接口
                            this.QRCheck(retData) 
                        },1000)
                      }else{
                        this.$message.warning('加载验证二维码失败,请重新登录或联系员')
                      }
                    })
                } else {
                    this.$message({
                        message: '您输入的，账号或密码错误！',
                        type: 'warning'
                    });
                }
            }); 
    },
    QRCheck(objData){  
      let url = `扫描二维码 结果  接口`;
      let data = {}
      this.$post(url,data).then(ret => {
          if(ret.code == 200){
            if(ret.data.ScanStatus == "1"){
              // 扫描结果为 1 则，关闭定时器
              clearTimeout(this.timer)

              this.$store.dispatch("LoginCommit",objData).then(data => {
                  this.$router.push("/Wdhd");
              });
            }
          }else{
            clearTimeout(this.timer)
            this.$message.warning('校验二维码失败,请重新登录或联系员')
          }
      })
  }
  

备注：

设置定时器

this.timer = setInterval(()=>{  

         //被轮询的 业务  

        this.QRCheck(retData)

 },3000)      //间隔时间 

结束定时器

clearTimeout(this.timer)

this.timer 是设置定时器的返回标识，结束时需要 根据它来操作