一、直接上代码
<div ref="chatScroll" class="leftReturn">
里面好多的内容,这个有滚动条</div>
container: null,
isUserScrolling: false,
scrollFlag: false,
that.chcekScroll();
that.executeScroll(true 或者 false);
updated() {
if (!this.container) {
this.container = document.querySelector('.leftReturn');
}
},
beforeDestroy() {
if (this.container) {
this.container.removeEventListener('scroll', () => {
if (this.isUserScrolling) {
this.scrollFlag = true;
} else {
this.scrollFlag = false;
}
});
this.container.removeEventListener('wheel', () => {
this.isUserScrolling = true;
});
}
},
chcekScroll() {
this.isUserScrolling = false;
this.container.addEventListener('scroll', () => {
if (this.isUserScrolling) {
this.scrollFlag = true;
} else {
this.scrollFlag = false;
}
});
this.container.addEventListener('wheel', () => {
this.isUserScrolling = true;
});
},
executeScroll(scrollFlag) {
if (scrollFlag) {
this.$refs.chatScroll.scrollTop =
this.$refs.chatScroll.scrollHeight - this.$refs.chatScroll.clientHeight;
}
},