滚动条在移动应用中很常见。滚动点击进入时，问题描述我们在开发webapp的时候，经常会遇到一个问题，就是当从一个可滚动的列表页滚动到下一个详情页，再回到列表页时，很难恢复滚动条的状态，输入时不可能记住位置。之前试过很多方法：有vue-router自带的scrollBehavior，需要记住scrollTop，然后恢复，但是管理这个scrollTop很麻烦，有时候获取值和使用纯CSS不太容易，在列表页面放置一个router-view，详情页使用position和z-index覆盖列表页。返回后，直接显示原来的列表页面。这个必须预先配置好每一层页面的路由，否则显示会混乱，同时一个页面出现在不同的子路由下，需要配置多次。比如很多地方需要配置产品详情，造成冗余。上述解决方案都不是理想的解决方案。后来参考keep-alive开发了vue-page-stack。保存Vue页面的栈，也就是Vue中的虚拟dom，但是滚动条的问题还是没有解决。因为虚拟dom没有记录各个组件的滚动状态，所以无法恢复。我在使用cube-ui的时候发现使用这个组件库中的scroll容器可以恢复滚动条。我进一步发现这就是黄奕先生更好的滚动的原因。通过查看bs的源码，原来bs的内部实现并不是原生的滚动，而是记录了一些滚动信息，其中最重要的是x和y，也就是滚动值。我通过变换实现了一组滚动行为。实现了，恢复虚拟dom的时候，滚动信息也恢复了。最终vue—page-stack+bs可以完美实现页面栈的还原和下拉加载。这个问题在消息记录等查询中比较常见，在小程序中也会遇到此类问题。问题描述大部分滚动场景都是上拉加载，上拉加载时，加载的内容出现在滚动区域下方。加载完成后，我们将数据添加到列表中，Vue负责渲染新加载的内容。我们可以继续上拉继续滚动查看。但是在我们的场景中，滚动某个session中的消息记录时，是下拉加载更多的消息。加载完成后，继续下拉，慢慢滚动查看。这就导致了一个很严重的问题：下拉加载后出现的内容在滚动区域的上方。如果不做任何处理，加载后会直接跳到新加载内容的最前面，因为滚动距离没有变化，这是个问题，这与我们想要实现的目标不一致。解决方案也想了很多方法，包括计算新增消息的总长度，然后回滚，但是消息的类型和高度不一致，计算就会有错误。最终想到的解决方案是：通过接口获取加载信息后，先标记（使用shouldScroll标记）后端返回的第一条消息，即加载后我们希望从我们的视角看到的新内容。messageList更新后，Vue会更新它的Data和views。此时更新页面dom，挂载MessageItem组件。此时，视图的渲染已经完成。通过勾选标记（shouldScroll），通知父容器滚动到刚才标记的位置，也就是加载的第一条消息。这样渲染和滚动就在线完成了，欢迎体验客户端和管理
