VUE 实现下拉分页加载更多功能

	<div class="con_item" v-for="item in pageArr"> 		<div class="name" >{{item.name}}</div> 	</div> 	<div class="loading" style="display: none" ref="loading"> 		<img src="../assets/loading.gif" > 		<span>正在加载更多数据</span> 	</div> 	<div class="text" style="display: none" ref="text"> 		<span>没有更多数据啦</span> 	</div> 

js

data(){return{pageNum:1,propertyData:'',totalnum:'',pageArr:[],}}, //滚动事件监听处理	 mounted(){ 	window.addEventListener('scroll',this.handleScroll) },  //滚动事件监听处理	 handleScroll(){		 //是否滚动到底部判断 if((document.documentElement.scrollTop+window.innerHeight)==document.body.offsetHeight){ 	this.getpageData() 	}}, 	} 	//请求列表数据 async getApiData(){ 				var that=this; 				let proData= await API.ajaxGet(url,{ 					'pageNum':this.pageNum, 					'pageSize':10 				}) 				that.propertyData=proData.data.data.resultList 				that.totalnum=proData.data.data.pages 				把每次请求的数据放入一个数组里 				that.propertyData.forEach((item)=>{ 					that.pageArr.push(item) 				}) 			}, 		//判断pageNum的值，并显示加载符号 	getpageData(){ 				var that=this		 				if(that.pageNum<this.totalnum){					 					that.$refs.loading.style.display="block" 					that.pageNum++ 					setTimeout(function(){ 						that.getApiData() 					},1000) 				}else{ 					setTimeout(function(){ 						that.$refs.loading.style.display="none" 						that.$refs.text.style.display="block" 					},5000)					 				}				 			},