uni-app的下拉刷新

首先要在pages.json里

{
 "pages": [
  {
   "path": "pages/index/index",
   "style": {
   //首先要在这里开启下拉刷新
    "enablePullDownRefresh": true
   }
  }, 

页面代码

<template>
	<view>
		{{name}}
	</view>
</template>
<script>
	export default{
		data(){
			return{
				name:''
			}
		},
		//首先 页面一进来 加载一次数据
		onLoad() {
			let _this = this;
			_this.getshju();
		},
		//在拉 在请求一次数据  下拉刷新
		onPullDownRefresh(){
			let _this = this;
			_this.getshuju()
		},
		methods:{
			getshuju(){
				//获取数据的时候出现舒心的样式
				uni.showNavigationBarLoading();
				// 请求数据
					
				uni.request({
					url:'你的接口',
					success:(res)=>{
						this.name = res.name
						//这时候 请求完成后 停止刷新 的样式 也就是uni.showNavigationBarLoading();
						uni.hideNavigationBarLoading();
						uni.stopPullDownRefresh();
					}
				})
			}
		}
	}
</script>
发布了47 篇原创文章 · 获赞 22 · 访问量 1万+

猜你喜欢

转载自blog.csdn.net/wuwenjie_1997/article/details/103635040