首次进入下拉至底部

zengh

2021-06-24 b8cd1296547fa4940ab55a3ebf8772972aa2391b

 pages/groupChat/chating.vue

@@ -35,7 +35,7 @@
         </view>
         <view class="chat-ls" v-for="(item, index) in msgs"
                                         :key="index"
                                          :id="'msg' + item.tip">
                                          :id="'msg' + item.id">
            <view class="chat-time" v-if="item.postTime != ''">{{ item.postTime | Msgdate }}</view>
            
            <view class="msg-m msg-left" v-if="item.senderId != senId">
@@ -150,6 +150,7 @@
            recName: null,//接收者姓名
            senAvatar:null,//发送者头像
            senId: null,//接收者id
            getData: null,
            animationData: {},            // 动画
            nowpage: 0,                   // 页码
            loading: '',                  // 滚动事件
@@ -175,31 +176,31 @@
         },
         // 滚动顶部加载上一页
         nextPage() {
            if(this.nowpage > 0 && this.begainloading) {
               // 出现loading icon
               this.isload = false
               this.begainloading = false
            // if(this.nowpage > 0 && this.begainloading) {
            //    // 出现loading icon
            //    this.isload = false
            //    this.begainloading = false
               
               var animation = uni.createAnimation({
                  duration: 1000,
                  timingFunction: 'step-start'
               })
            //    var animation = uni.createAnimation({
            //       duration: 1000,
            //       timingFunction: 'step-start'
            //    })
               
               this.animation = animation
            //    this.animation = animation
               
               
               let i = 1
               this.loading = setInterval(function() {
                  animation.rotate(i * 30).step()
                  this.animationData = animation.export()
                  i++
                  // 滑动加载数据
                  if(i > 40) {
                     this._getMsg(this.nowpage)
                  }
            //    let i = 1
            //    this.loading = setInterval(function() {
            //       animation.rotate(i * 30).step()
            //       this.animationData = animation.export()
            //       i++
            //       // 滑动加载数据
            //       if(i > 40) {
            //          this._getMsg(this.nowpage)
            //       }
                  
               }.bind(this), 100)
            }
            //    }.bind(this), 100)
            // }
            
            
         },
@@ -233,6 +234,7 @@
                     }
                  }
                  let msg = res.data.data.chatRecordsIPage
                  that.getData = msg;
                  // 页数加1
                  //let msg = datas.message()         
                  let maxpages = msg.length
@@ -244,7 +246,7 @@
                     that.nowpage = -1
                  }
                  // 数据分页加载 每十条为一页
                  for(var i = page * 10; i < maxpages; i++){
                  for(var i = 0; i < msg.length; i++){
                     msg[i].imgUrl = '../../static/images/index/friend-list/'+msg[i].imgUrl
                     // 时间间隔
                     if(i < msg.length-1){
@@ -264,7 +266,7 @@
                  
                  that.$nextTick(() => {
                     that.isanimation = false
                     that.scrollToView = 'msg' + that.msgs[maxpages - page * 10 - 1].tip
                     that.scrollToView = 'msg' + that.getData[0].id
                  })
                  // 数据加载完毕关闭动画，停止数据加载
                  clearInterval(this.loading)
@@ -362,8 +364,8 @@
            this.isanimation = true
            this.scrollToView = ''
            this.$nextTick(() => {
               let len = this.msgs.length -1
               this.scrollToView = 'msg' + this.msgs[len].tip
               let len = this.getData.length -1
               this.scrollToView = 'msg' + this.getData[0].id
            })
         },
         // 地图定位