转自 [https://segmentfault.com/a/1190000016554851]
感觉看这个图之后,比较明白
(https://segmentfault.com/a/1190000016554851)

在VUE项目中有个需求,当内容滑倒底部的时候,下一步按钮才显示
在VUE中使用如下
<template>
<div @scroll.passive="getScroll($event)">
</div>
</template>
<script>
created(){
this.getScroll($event)
},
methods:{
getScroll($event){
//内容高度
let scrollHeight = $event.target.scrollHeight;
//向上滑动的高度
let scrollTop = $event.target.scrollTop;
//可视内容高度
let height = $event.target.clientHeight
height + scrollTop >= scrollHeight ? ( this.button = true) : ( this.button = false)
}
}
</script>
网友评论