提交 11be388f 编写于 作者: zhujiamin's avatar zhujiamin

回到顶部按钮及动画--fix3

上级 9263f199
...@@ -169,7 +169,7 @@ ...@@ -169,7 +169,7 @@
</ion-list> </ion-list>
</#if> </#if>
<div class="no-data" v-if="items.length == 0">暂无数据</div> <div class="no-data" v-if="items.length == 0">暂无数据</div>
<div class="scrollToTop" @click="scrollToTop" ref="scroll"> <van-icon name="back-top" /></div> <div class="scrollToTop" @click="scrollToTop" ref="scroll" v-show="isEnableScrollTop && showScrollButton"> <van-icon name="back-top" /></div>
</div> </div>
</div> </div>
</template> </template>
\ No newline at end of file
...@@ -885,7 +885,10 @@ ...@@ -885,7 +885,10 @@
}, false) }, false)
list.addEventListener('scroll', (e:any) => { list.addEventListener('scroll', (e:any) => {
if (scroll && list) { if (scroll && list) {
scroll.style.opacity = list.scrollTop * 0.001; if (list.scrollTop >= 500) {
this.showScrollButton = true;
}
scroll.style.opacity = (list.scrollTop-200) * 0.001;
} }
}, false) }, false)
} }
...@@ -1102,6 +1105,22 @@ ...@@ -1102,6 +1105,22 @@
} }
/**
* 是否开启置顶功能
*
* @type {GlobalUiService}
* @memberof ${srfclassname('${ctrl.codeName}')}Base
*/
public isEnableScrollTop:boolean = true;
/**
* 显示置顶按钮
*
* @type {GlobalUiService}
* @memberof ${srfclassname('${ctrl.codeName}')}Base
*/
public showScrollButton:boolean = false;
/** /**
* 滑回顶部 * 滑回顶部
* *
......
Markdown 格式
0% or
您添加了 0 到此讨论。请谨慎行事。
先完成此消息的编辑!
想要评论请 注册