首先在page页面设置enablePullDownRefresh属性
{ "path": "pages/index/index", "style": { "navigationBarTitleText": "uni-app", "enablePullDownRefresh":true } }
index.vue
<template> <view> <view v-for="(item,index) of newList" :key="index" class="newList"> {{item}} </view> </view> </template> <script> export default { data() { return { newList:[] } }, onLoad(e) { this.getNews() }, onPullDownRefresh() { this.getNews() //停止加载图标 }, methods: { getNews(){ uni.showNavigationBarLoading() uni.request({ url:‘https://demo.hcoder.net/index.php?user=hcoder&pwd=hcoder&m=List1&page=1‘, success: (res) => { this.newList=res.data.split(‘--hcSplitor--‘) uni.stopPullDownRefresh() uni.hideNavigationBarLoading() } }) } } } </script> <style> .newList{ line-height: 2em; padding: 20px; } </style>