微信小程序 即时聊天IM，怎么将接受的消息渲染到UI上？

Question

// pages/person/person.js
var app = getApp()
import TIM from 'tim-wx-sdk';
import COS from "cos-wx-sdk-v5";
let options = {
  SDKAppID:  // 接入时需要将0替换为您的即时通信应用的 SDKAppID
};
// 创建 SDK 实例，TIM.create() 方法对于同一个 SDKAppID 只会返回同一份实例
let tim = TIM.create(options); // SDK 实例通常用 tim 表示
Page({
  /**
   * 页面的初始数据
   */

  data: {
    p_identity: "",
    message: ""
  },
  onGotUserInfo: function(e) {
    var that = this;
    // console.log(e.detail.errMsg)
    console.log(e.detail.userInfo)
    // console.log(e.detail.rawData)
    if (e.detail) {
      getApp().globalData.userInfo = e.detail.userInfo;
      that.setData({
        userInfo: e.detail.userInfo,
        userInfoFlag: true,
        modalHidden: true
      })
    } else console.log(1234);
    wx.navigateTo({
      url: '../register/register',
    })

  },
  goto_upload_ps_info: function(e) {
    wx.navigateTo({
      url: '../Upload_personal_information/Upload_personal_information',
    })
  },
  tim_login: function(e) {
    wx.request({
      url: 'https://www.ffgbookbar.cn/zhaopin/public/index.php/index', //仅为示例，并非真实的接口地址
      data: {
        id: app.globalData.userid
      },
      header: {
        'content-type': 'application/json' // 默认值
      },
      method: 'get',
      success(res) {
        console.log(res) //从服务器返回
        console.log(app.globalData.userid);
        console.log("123");
        app.globalData.usersig = res.data.split("verify ")[0];
        let promise = tim.login({
          userID: app.globalData.userid,
          userSig: app.globalData.usersig
        });
        promise.then(function (imResponse) {
          console.log(imResponse.data); // 登录成功
        }).catch(function (imError) {
          console.warn('login error:', imError); // 登录失败的相关信息
        });
      }
    })
  },

  send_payload:function(e){
    // 发送文本消息，Web 端与小程序端相同
    // 1. 创建消息实例，接口返回的实例可以上屏
    let message = tim.createTextMessage({
      to: 'user0',
      conversationType: TIM.TYPES.CONV_C2C,
      payload: {
        text: 'nihao!!!!!!'
      }
    });
    // 2. 发送消息
    let promise = tim.sendMessage(message);
    promise.then(function (imResponse) {
      // 发送成功
      console.log("send success!");
      console.log(imResponse);
    }).catch(function (imError) {
      // 发送失败
      console.warn('sendMessage error:', imError);
    });

  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function(options) {
    console.log(app.globalData.identity == '面试官')
    this.setData({
      p_identity: getApp().globalData.identity
    })
  },

})
let onMessageReceived = function (event) {
  // event.data - 存储 Message 对象的数组 - [Message]
  console.log("收到即时消息！");
  console.log(event.data);
  console.log(event.data[0].payload.text);
};
tim.on(TIM.EVENT.MESSAGE_RECEIVED, onMessageReceived);

var i=0;

let onConversationListUpdated = function (event) {
  console.log("收到离线消息！");
  console.log(event.data);
  console.log(event.data[i].lastMessage.messageForShow);// 包含 Conversation 实例的数组
  i++;
};
tim.on(TIM.EVENT.CONVERSATION_LIST_UPDATED, onConversationListUpdated);

怎么将

let onConversationListUpdated = function (event) {
  console.log("收到离线消息！");
  console.log(event.data);
  console.log(event.data[i].lastMessage.messageForShow);// 包含 Conversation 实例的数组
  i++;
};
tim.on(TIM.EVENT.CONVERSATION_LIST_UPDATED, onConversationListUpdated);

里的数据渲染到UI上。setdata（）都不能用，用了会报错

Answer 1

是this指向报错吗？写成箭头函数呢？