短视频商城系统，自动更改每次下拉后的刷新动画

短视频商城系统，自动更改每次下拉后的刷新动画

第一步：在pages.json 里面加下图的一句话。然后刷新页面之后只要往下拉。

 

1	{<br>"path": "pages/shop/home", //vue商城首页<br>"style": {<br>"navigationBarTitleText": "商城首页",<br>"navigationBarBackgroundColor": "#56D5FF",<br>"enablePullDownRefresh": true,<br>"app-plus": {<br>}<br>}<br>},

​第二步。此时动画有了可是不能及时的收回。所以要在当前页面做一些其它的配置让体验更好一些。

 

1	<br>onLoad(){<br>//1.刚进入页面的时候就加载这个动画<br>uni.startPullDownRefresh();<br>},<br>// 2.下拉刷新<br>onPullDownRefresh() {<br>console.log('refresh');<br>setTimeout(function () {<br>uni.stopPullDownRefresh();<br>// 这里放刷新数据的方法<br>}, 1000);<br>},

第三步。默认下拉的动画圈圈是绿色的。如果不喜欢可以更改。

还是要在pages.json里面的进行一个简单的配置。

1

<br>{<br>"path": "pages/shop/home", //vue商城首页<br>"style": {<br>"navigationBarTitleText": "商城首页",<br>"navigationBarBackgroundColor": "#56D5FF",<br>"enablePullDownRefresh": true,<br>"app-plus": {<br>                "pullToRefresh": {<br>                        "support": true,<br>                        "color": "#000000", //小圈圈的颜色<br>                        "style": "circle" //小圈圈的样式<br>                    }<br>}<br>}<br>},

以上就是短视频商城系统，自动更改每次下拉后的刷新动画， 更多内容欢迎关注之后的文章