介紹

環(huán)信小程序demo是基于環(huán)信im SDK開(kāi)發(fā)的一款即時(shí)通訊的小程序。這個(gè)demo可以幫助開(kāi)發(fā)者們更輕松的集成環(huán)信SDK。可掃碼體驗(yàn)：

demo 包含以下功能

• 最近通話
• 通訊錄
• 通知（加好友、加群）
• 設(shè)置

在本地跑起來(lái)

拉取代碼，導(dǎo)入開(kāi)發(fā)者工具即可運(yùn)行起來(lái)。

數(shù)據(jù)結(jié)構(gòu)

登錄頁(yè)：
        login: {
            name:'',
            psd: '',
            grant_type: 'password',
        }
        
注冊(cè)頁(yè)：
        register: {
            username: '',
            password: ''
        }
        
通訊錄頁(yè)：
       member:[],   //好友列表
       
聊天頁(yè)：
       chatMsg:[{
            info:{
                to:''         
            },
            username:'',      //用戶名
            yourname:'',      //好友名
            msg: {
                type:'',    
                data:''
            },
            style:'',       //樣式
            time:'',
            mid:''        //message ID
       }]
       
globalData: 
    userInfo: '',  //用戶微信授權(quán)信息
    chatMsg: []   //用于存儲(chǔ)離線消息
    
緩存：
   myUsername: ''    //緩存登錄用戶名     
   yourname + myName:''  //以用戶名跟好友名為key來(lái)緩存聊天記錄

項(xiàng)目結(jié)構(gòu)

|- comps 自定義組件目錄
    |- addfriend 添加好友頁(yè)
    |-chat 聊天頁(yè)面
    |-swipedelete 測(cè)滑刪除
    |-toast toast
|-images demo中用到的圖片 還有表情
|-pages 功能頁(yè)面
    |-register 注冊(cè)頁(yè)
    |-login 登錄頁(yè)
    |-login_token token登錄頁(yè)
    |-chat 最近聯(lián)系人頁(yè)（通話）
        |-chatroom 聊天室頁(yè)
    |-main 聯(lián)系人頁(yè)
        |-add_new 加好友頁(yè)
        |-group 群組頁(yè)
            |-groupSetting 群組設(shè)置頁(yè)
    |-notificaton 通知頁(yè)
        |-notificaton_friendDetail 加好友通知頁(yè)
        |-notificaton_groupDetail 加群組通知頁(yè)
    |-setting 設(shè)置頁(yè)
        |-setting_general 通用設(shè)置頁(yè)
|-utils 工具類和sdk的一些配置
|-sdk 環(huán)信sdk
|-app.js 小程序根實(shí)例，存放一些全局變量，注冊(cè)監(jiān)聽(tīng)事件
|-app.json 注冊(cè)頁(yè)面以及全局的一些配置
|-app.wxss 一些全局樣式
|-project.config.json工程的一些配置，和開(kāi)發(fā)者工具 “詳情” 中的設(shè)置一樣

可以復(fù)用的代碼

如果想快速搭建起一個(gè)有im能力的小程序，可以選擇復(fù)用demo中的代碼，其中utils以幫助快速集成sdk，comps > chat是聊天頁(yè)。當(dāng)然其他部分需要復(fù)用的，如常見(jiàn)的測(cè)滑刪除、聯(lián)系人按字母分類、通知的訂閱模式也可以去具體文件去找。

遇到的一些坑

• 聊天頁(yè)面布局，input定位后，光標(biāo)會(huì)錯(cuò)位，官方的說(shuō)法是，input focus時(shí)不能使用動(dòng)畫(huà)。
• 在scroll-view中無(wú)法觸發(fā)onPullDownRefresh。
• margin-bottom 只有在下面還有元素時(shí)才生效。
• 使用enablePullDownRefresh看不見(jiàn)下拉動(dòng)畫(huà)，需要將backgroundTextStyle設(shè)為dark。
• 播放語(yǔ)音 onTimeUpdate在開(kāi)發(fā)者工具上不能穩(wěn)定觸發(fā)。
• background-image只能用網(wǎng)絡(luò)地址。
• 適配iphone X 使用wx.getSystemInfo() 返回的model在工具上是'iPhone X' 在真機(jī)上后面還會(huì)有其他字符，不要精確匹配。
  小程序的坑還有很多，這里只列舉我遇到的一部分，大家還需在坑里前行，希望后來(lái)的開(kāi)發(fā)者可以繞過(guò)這些坑。

寫(xiě)在最后

這期小程序demo只完善了單聊部分，后面還要優(yōu)化群組的一些功能，還有一些功能demo沒(méi)有去實(shí)現(xiàn)但是sdk是支持的，要用到的話大家可以去查文檔