2021-10-19

关于微信小程序加载聊天历史记录

本篇文章的效果是下拉加载历史记录，本且从顶部向上滑动效果，可划到历史内容，应该为三步：
**1.**使用scroll-view 标签并且里面有下拉加载以及scroll-top（用来设置滚动条高度）
**2.**设置一个隐藏盒子，得到盒子中内容的高度
**3.**触发下拉将获取的高度直接赋值scroll-top，并且数据相加，最后看效果
具体代码：

<scroll-view class="clost" scroll-y="{{true}}" bindscroll="bindscroll" scroll-top="{{intoviews}}"
    bindrefresherrefresh="onRefresh" refresher-enabled="true" refresher-triggered="{{triggered}}"
    scroll-into-view="{{intoView}}">
    <!-- 这一部分为循环的数据 -->
    <view wx:for="{{list}}" bindtap="change" style="text-align: {{item.position}};" wx:key="index">
      {{item.title}}</view>
      <!-- 标记数据 -->
    <view id="di">
      我是底部
    </view>
  </scroll-view>

<!-- 隐藏的盒子两个盒子样式必须相同（即内容样式，此处数据占多高将数据渲染也为多高） -->
<view class="hiddens">
  <view wx:for="{{list1}}" style="text-align: {{item.position}};" wx:key="index">
    {{item.title}}
  </view>
</view>

回来可以录一下视频效果，请参考，萌新不懂！