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