vue项目中flag的作用

• 一、项目背景
• • 1.大数据接口请求优化（5S请求一次）
  • 2.点击页码请求flag来判断

短信发送列表页面，由三部分组成，搜索条件，列表，页码。因为当前列表是大数据来源数据，数据多达70亿数据，所以接口请求时间在一分钟作用，每次请求一百条数据

res.data中有个一个jobId,请求带上jobId就会继续当前的查询，如果想取消当前的查询，请求参数中带上一个oldJobId参数，就是上一个查询的jobId

 dataTimes(){
后端接口(参数).then(res => {
    if (resp.code == 200) {
        if(resp.data.status==1){ //请求成功
           this.productList=[...this.productList,...resp.data.list]
           //把请求的数据存到localStorage中的smsSendDate里面
            this.nextContentPage=true //是否是第一个点击11页
            this.curClick=false //离开当前页面是否在请求
            //离开当前页面会保留上面两个flag
            
            //100条数据+1是为了显示第11页的页码
            this.page.totalCount = this.productList.length+1
        }else{
             //计时器5s请求一次
             this.getDate = setTimeout(this.dataTimes, 5000);
        }
    } else {
        this.$message.warning(resp.message)
    }
})
},

点击11页需要发起新的请求，每次请求会请求100条数据，请求参数是sendPageNum=1，以后++。而且当离开当前页面时候也要保持当前页面的状态，页面和请求接口

//初始时候curClick:false，离开当前页没有请求接口
//nextContentPage:true,没有点击请求新页

//截取对应当前页的数据
 getCurList(){
     this.curProductList=JSON.parse(localStorage.getItem("smsSendDate"));
     this.curProductList= this.curProductList.splice((this.page.pageNum-1)*this.page.pageSize,this.page.pageSize)
   },

//点击页面对应的逻辑
 getPageChange(){
	if(this.curClick){ //curClick这个falg是判断离开当前页面是否在请求状态，true是请求状态
	         if((this.page.pageSize*this.page.pageNum)>this.productList.length){ //点击十一页（1*11>101）
	         this.curProductList=[[]] //当前页数据是【】
	         this.nextContentPage=false //说明11页已经在请求了
	         }else {
	         //点击第十页，需要在100条数据中截取
	             this.nextContentPage=false
	             if(this.productList){
	             this. getCurList() //截取对应当前页的数据
	             }
	         }
	     }else{
	         this.curClick=false
	         if((this.page.pageSize*this.page.pageNum)>100*this.sendPageNum && this.nextContentPage){
	         //点击了11页，nextContentPage=false当前页已经在请求数据了
	                 this.nextContentPage=false//存到localStorage
	                 this.curProductList=[[]]
	                 this.sendPageNum++
	                 this.getDateFun()//请求列表的接口
	             }else {
	             this.getCurList()//截取对应当前页数据
	             }