
1、创建一个空数组,用于存储聊天记录数据。
2、在websocket接收到聊天信息时,将聊天信息添加到数组中,可以使用unshift()方法将新信息添加到数组的最前面,这样可以保证最新的聊天记录始终出现在页面的顶部。
3、在页面中使用v-for指令遍历数据列表,并使用v-bind指令将数据绑定到对应的DOM元素上。
4、在页面中使用滚动区域(如div)包裹聊天记录列表,当新的聊天记录添加到数组中时,可以使用JavaScript中的scrollTop属性将滚动条自动滚动到底部。
现在有很多做聊天的框架啊,比如融云、腾讯云、GoEasy这些。
在整个uniapp生态体系内,即时通讯这一块要说对uniapp支持不错的估计就只有GoEasy了。
这里有一份GoEasy提供的uniapp版本的即时通讯源码,他们的API很简单,你可以下载下来跑一下,再结合开发文档看一遍,基本就会了。
这个demo可以打包成安卓、iOS的APP,也可以打包成微信小程序。
支持发送文字、、语音、视频这些
源码地址:网页链接
欢迎分享,转载请注明来源:内存溢出
微信扫一扫
支付宝扫一扫
评论列表(0条)