|
|
@@ -1,15 +1,13 @@
|
|
|
<template>
|
|
|
<mobile-frame :frameStyle="frameStyle" @toPath="toPath">
|
|
|
- <scroll-view scroll-y="true" class="scroll-view" @scrolltolower="toPage">
|
|
|
+ <scroll-view scroll-y="true" class="scroll-view" scroll-with-animation :scroll-top="scrollTop" @scroll="scroll" @scrolltolower="toPage">
|
|
|
<view class="list-scroll-view">
|
|
|
<view class="main">
|
|
|
<view class="zero one">
|
|
|
- <input type="text" placeholder="搜索商品" @tap="toCommon('pagesHome/market/search')"
|
|
|
- placeholder-class="placss">
|
|
|
+ <input type="text" placeholder="搜索商品" @tap="toCommon('pagesHome/market/search')" placeholder-class="placss">
|
|
|
</view>
|
|
|
<view class="zero two">
|
|
|
- <swiper class="swiper" circular :indicator-dots="true" indicator-color="#ffffff"
|
|
|
- indicator-active-color="#FB1438" :autoplay="true" :interval="3000" :duration="1000">
|
|
|
+ <swiper class="swiper" circular :indicator-dots="true" indicator-color="#ffffff" indicator-active-color="#FB1438" :autoplay="true" :interval="3000" :duration="1000">
|
|
|
<swiper-item class="list" v-for="(item,index) in bannerList" :key="index">
|
|
|
<image class="image" :src="item.url&&item.url.length>0?item.url[0].url:''" mode="">
|
|
|
</image>
|
|
|
@@ -57,6 +55,9 @@
|
|
|
</view>
|
|
|
</view>
|
|
|
</scroll-view>
|
|
|
+ <view class="backTop" v-if="old.scrollTop>500">
|
|
|
+ <text @tap="goTop" class="iconfont icon-fanhuidingbu"></text>
|
|
|
+ </view>
|
|
|
</mobile-frame>
|
|
|
</template>
|
|
|
|
|
|
@@ -81,7 +82,12 @@
|
|
|
total: 0,
|
|
|
skip: 0,
|
|
|
limit: 5,
|
|
|
- page: 0
|
|
|
+ page: 0,
|
|
|
+ // 返回顶部
|
|
|
+ scrollTop: 0,
|
|
|
+ old: {
|
|
|
+ scrollTop: 0
|
|
|
+ }
|
|
|
};
|
|
|
},
|
|
|
onLoad: function() {
|
|
|
@@ -178,6 +184,17 @@
|
|
|
title: '没有更多数据了'
|
|
|
});
|
|
|
},
|
|
|
+ // 计算高度
|
|
|
+ scroll: function(e) {
|
|
|
+ this.old.scrollTop = e.detail.scrollTop
|
|
|
+ },
|
|
|
+ // 返回顶部
|
|
|
+ goTop: function(e) {
|
|
|
+ this.scrollTop = this.old.scrollTop
|
|
|
+ this.$nextTick(function() {
|
|
|
+ this.scrollTop = 0
|
|
|
+ });
|
|
|
+ },
|
|
|
}
|
|
|
}
|
|
|
</script>
|
|
|
@@ -371,4 +388,16 @@
|
|
|
flex-direction: column;
|
|
|
}
|
|
|
}
|
|
|
+
|
|
|
+ .backTop {
|
|
|
+ position: fixed;
|
|
|
+ bottom: 20vw;
|
|
|
+ right: 5vw;
|
|
|
+
|
|
|
+ text {
|
|
|
+ font-size: 30px;
|
|
|
+ background-color: #0000005f;
|
|
|
+ border-radius: 90px;
|
|
|
+ }
|
|
|
+ }
|
|
|
</style>
|
