【目标】记住滚动条的位置,来回切换组件页面在原来的位置显示
先搞清楚问题出在哪:
1.列表滚动为什么会互相影响?
当滚动时他们不是在自己页面滚动,而是在整个body页面滚动,无论你在A频道还是B频道,都是Body在滚动。
2.如何找到是哪个元素产生的滚动?
把下面代码粘贴到调试工具,然后滚动页面,就可以查看是哪个元素产生滚动了
function findScroller(element) {
element.onscroll = function(){console.log(element)}
Array.from(element.children).forEach(findScroller)
}
findScroller(document.body)
【解决方案】:让滚动的元素产生自己的滚动容器
- 固定高度:hight:xxx;
- 溢出滚动:overflow-y:auto;