第微信小程序實現簡單聊天室本文實例為大家分享了微信小程序實現簡單聊天室的具體代碼，供大家參考，具體內容如下

cha.js

//pages/chat/chat.js

//獲取小程序實例

letapp=getApp();

Page({

*頁面的初始數據

data:{

nickname:'',

avatar:'',

chatlists:[

nickname:'小林',

avatar:'/timgimagequality=80size=b9999_10000sec=1591617971938di=30d9f3b49a0d1b27fb4b61ea424f82c9imgtype=0src=http%3A%2F%2F%2Fuploads%2Fitem%2F201610%2F07%2F20161007135058_nUxji.jpeg',

content:`你好呀！`

invalue:''

sendMsg:function(){

let_this=this;

letobj={

nickname:_this.data.nickname,

avatar:_this.data.avatar,

content:_this.data.invalue

letarr=_this.data.chatlists;

arr.push(obj)

_this.setData({

chatlists:arr,

invalue:''

//把聊天內容發送到服務器，處理完成后返回，再把返回的數據放到chatlist里面

getInput:function(e){

console.log(e.detail.value);

this.setData({invalue:e.detail.value});

*生命周期函數--監聽頁面加載

onLoad:function(options){

console.log(app.globalData.userInfo.nickName);

this.setData({

nickname:app.globalData.userInfo.nickName,

avatar:app.globalData.userInfo.avatarUrl

*生命周期函數--監聽頁面初次渲染完成

onReady:function(){

*生命周期函數--監聽頁面顯示

onShow:function(){

*生命周期函數--監聽頁面隱藏

onHide:function(){

*生命周期函數--監聽頁面卸載

onUnload:function(){

*頁面相關事件處理函數--監聽用戶下拉動作

onPullDownRefresh:function(){

*頁面上拉觸底事件的處理函數

onReachBottom:function(){

*用戶點擊右上角分享

onShareAppMessage:function(){

})

chat.wxml

blockwx:for="{{chatlists}}"wx:for-index="ind"wx:for-item="chat"wx:key="ind"

viewwx:if="{{nickname==chat.nickname}}"

view

view

{{chat.content}}

/view

/view

view

imagesrc="{{chat.avatar}}"/image

/view

/view

viewwx:else

view

imagesrc="{{chat.avatar}}"/image

/view

view

view