页面滚动到指定位置——记录div滚动高度，并下次自动滚动到该位置

本文主要是介绍页面滚动到指定位置——记录div滚动高度，并下次自动滚动到该位置，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

 <div style="width: 220px; height: calc(100vh - 1.6rem)"class="scroll hide-scroll"ref="menu"><div v-for="(item, i) in 100":key="i"><div>{{ item}}</div></div></div>/* ****滚动条样式，添加改类名 scroll */
.scroll {overflow-y: auto;
}.scroll::-webkit-scrollbar {width: 8px;
}.hide-scroll::-webkit-scrollbar {width: 0px;
}.scroll::-webkit-scrollbar-thumb {background: #ccc;border-radius: 5px;
}.scroll::-webkit-scrollbar-thumb:hover {background: #d7f8f5;
}

mounted() {console.log(localStorage.getItem("menu"));// 获取上次滚动高度，自动滚动到顶部// ☆☆☆☆☆ 必须加 $nextTick 滚动才起作用this.$nextTick(() => {if (localStorage.getItem("menu")) {this.$refs.menu.scrollTo({top: localStorage.getItem("menu") * 1,// behavior: "smooth",});}});this.$refs.menu.addEventListener("scroll", this.handleScroll);},methods: { handleScroll() {var scrollTop = this.$refs.menu.scrollTop;localStorage.setItem("menu", scrollTop);},},

这篇关于页面滚动到指定位置——记录div滚动高度，并下次自动滚动到该位置的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---