解决历史消息的「上滑分页」加载问题。
方案一：
使用 scroll-view，监听到下一页消息时，获取当前页第一条消息的 id，然后获取此 id 所在节点在页面中的高度，改变 scroll-top 的值滚动到这个 id 的位置，由于渲染顺序的问题，滚动需要等待一会，否则获取不到新消息进来后上一页消息的id，但是下一页消息刷新时，由于小程序异步更新的视图渲染机制，导致每次都会闪烁一下，体验很差。
其中 scroll-into-view 属性滚动到某个节点，和 scroll-top 滚动的触发是不同的，scroll-top 只要数值改变就能触发，所以使用了 +1，而 scroll-into-view 只有在第一次进页面时才会触发，后面都不触发，所以后面就弃用了，还要每次都获取高度，再通过 scroll-top 滚动。这块需要自己一点点尝试，文档没有详细说明。
方案二：
使用 flex 布局， flex-direction: column-reverse; 翻转数组的顺序，这种方式并不能在向上滚动时，下一页加进来后增加滚动空间。
方案三：
想到既然下滑刷新是流畅的，那么如何让上滑也有类似的效果呢？所以想到了先把整个布局旋转180度，模拟向下滚动的效果，再把里面每一条消息内容翻转180度，这样视觉上就看起来正常了，由于此时并没有看到方案五的那篇文章，所以不太确定是否可行， 但是意识到滚动的方向改变了，那在手机上是不是也是倒着滚，还要改变滚动方向，越想越觉得很复杂，由于当时布局没有写对，导致翻转成功后无法滚动，加上各种疑问，所以放弃了这种方案，其实已经快要实现了。
方案四：
猜测可能是 scroll-view 性能不好（此时还不知道原因），所以想用整个页面的滚动试试，于是自己写了一份，发现仍然出现抖动，于是去插件市场看看有没有源码，发现很多个im的插件，但是其中的布局仍然是这2种。于是怀疑是不是滚动的位置不对导致的，如果刚好滚动到上一页的位置是不是就不会抖动？搜到了这篇专栏，花了9.9购买了专栏，说是能直接运行看到效果，为了方便就试了一下，效果确实很好，但是我照着写了以后，仍然出现了轻微的抖动，并不是最理想的结果。
wangjiabin.blog.csdn.net/article/det…
方案五：
由于意识到不可能通过重新定位解决这个问题，所以最终的解决方案只剩下一个了，那就是我之前放弃的方案3， 于是又推倒重来，这次在开始前，由于我知道了必须通过布局解决，加上我尝试过翻转页面，差一点实现效果，所以试了下使用关键词“scroll-view 翻转聊天”来google一下，果然被我搜到了这篇文章。
www.alloyteam.com/2020/04/143…
看到其中和我的踩坑经历几乎完全一样，而且文章有大量的针对细节问题的回复互动，和我之前的疑惑类似，看来经过了大量的验证，于是果断使用这个方案，最后实现了想要的效果。
这一次改动更大，因为操作栏上一些弹起操作时各种位置的变化都要修改，所以在这次修改的过程中，我去掉了很多分散在太多节点里 margin 和 padding，这些会影响计算的准确性，导致需要频繁地微调样式和过渡，所以我把这些都集中在一个节点里，通过 calc 一次性计算准确，减少了很多未知，不直观的样式问题。
