需求:
进来查询接口,状态(3种:待投决,已投决,已结束),除了已结束状态都需要每3秒轮询一次,直到离开页面或者状态变为已结束才结束轮询
created() {
// 查询
this.query(this.id)
},
query(id) {
joinDetail({id:id}).then(res =>{
if(res.status == true) {
// 赋值……
this.item = res.body
this.firstState = this.item.userVoteStatus.desc
// 判断状态:第一次进来除了已结束都需要轮询
if(this.item.userVoteStatus.desc === '待投决' || this.item.userVoteStatus.desc === "已投决") {
this.always()
}
}
})
},
always() {
//轮询接口
let that = this
that.timers = setInterval(() => {
// 当状态变为已结束时,就停止轮询
if (this.item.userVoteStatus.desc === '已结束'){
clearInterval(this.timers)
//否则则继续轮询
} else if (this.item.userVoteStatus.desc === "待投决" || this.item.userVoteStatus.desc === "已投决") {
that.queryVoteNum()
}
}, 3000);
},
// 实时查询投票人数等等的变化 --- 轮询
queryVoteNum() {
let that = this
let params = {id:that.id}
publishDetail(params).then((res)=>{
if(res.status == true) {
// 赋值
…………
that.item.status = res.body.status
that.item.topics = JSON.parse(JSON.stringify(res.body.topics))
}
})
.catch(function (err) {console.log(err)});
},
// 在vue实例销毁前调用(类似跳转路由调用)
beforeDestroy(){
clearInterval(this.timers)
},