uniapp聊天界面消息始終觸底的方法


聊天時,發送消息后,讓消息始終出現在最底部,也成功實現了

主要實現是參照了下面的方法:

uniapp + vue 實現滾動條一直在元素的最底部

(重點部分)

1、聊天界面html部分

##重點1: :id="'s' + chat.id + index "

<view v-for="(chat, index) in msgList" :key="chat.id">
                            <view  class="chat-items-type" v-if="chat.type == '1'" :id="'s' + chat.id + index ">
 </view>
----------------------------------------------------------------------------------------------------------------------------------
2、js部分
const msgList.pus({
id:that.msgList.length,
url:'',
content:''
 type:'1'
})       
##重點2:  currentMsg.id(一定要不同)
this.setScroll(currentMsg.id, 'jjj');
  
setScroll(id){
                let len = this.msgList.length;
                this.scrollInto = 's' + id +(len-1);
            },


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM