微信小程序渲染有问题

<!-- friend-list.wxml -->
<view class="friend-list">
  <block wx:for="{{friendData}}"  >
    <view class="friend-item" bindtap="goToChat">
      <image class="avatar" src="{{item.avatarUrl}}"></image>
      <view class="info">
        <view class="nickname">{{item.nickName}}</view>
        <view class="last-message">{{item.content}}</view>
      </view>
      <view class="time">{{item.createTime}}</view> <!-- 新增时间显示 -->
    </view>
  </block>
</view>
// pages/friends/friends.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    friendData: [],
    targetIds: [],//和我有过联系的用户id！
     //用户的 相关数据
    chatData:[],//
    lastMessages:[]
  },

 

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad(options) {
    let that = this;
  
    let userId = wx.getStorageSync('userInfo').id;
  
    wx.request({
      url: 'http://localhost:8080/user/targerIds?id=' + userId,
      method: 'GET',
      success: function (res) {
        that.setData({
          targetIds: res.data
        });
  
        var ids = res.data;
  
        var queryString = 'ids=' + ids.join(',');
  
        wx.request({
          url: 'http://localhost:8080/user/aboutUser?' + queryString,
          method: 'GET',
          success: function (res) {
            that.setData({
              friendData: res.data
            });
            console.log("***************")
  console.log(that.data.friendData)
  console.log("***************")
            // 循环发起请求获取消息数据
            for (let i = 0; i < that.data.targetIds.length; i++) {
              let targetUserId = that.data.targetIds[i];
              wx.request({
                  url: 'http://localhost:8081/getMessage?userId=' + userId + '&targetUserId=' + targetUserId,
                  method: 'GET',
                  dataType: "json",
                  success: function (res) {
                      let temp = res.data[res.data.length - 1];
                      console.log(temp);
          
                      // 寻找friendData中匹配的id并拼接数据
                      for (let j = 0; j < that.data.friendData.length; j++) {
                          if (that.data.friendData[j].id === temp.userId || that.data.friendData[j].id === temp.targetUserId) {
                              // 拼接数据
                              that.data.friendData[j].createTime = temp.createTime;
                              that.data.friendData[j].content = temp.content;
                              console.log("+++++++++++++++++++++++++")
                              console.log( that.data.friendData[j])
                              console.log("+++++++++++++++++++++++++")
                          }
                      }
                  }
              });
            }   
            console.log( that.data.friendData )
          },
          fail: function (error) {
            console.error(error);
          }
        });
 
      },
      fail: function (error) {
        console.error(error);
      }
    });
  },
  


  goToChat: function (e) {
    var index = e.currentTarget.dataset.index;
    wx.navigateTo({
      url: '/pages/chat/chat?friend=' + JSON.stringify(this.data.friendData[index])
    });
  },
 
  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady() {

  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow() {

  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide() {

  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload() {

  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh() {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom() {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage() {

  }
})

        在你的代码中，你在请求消息数据的回调函数中更新了 friendData 数组的元素，但由于 JavaScript 的异步特性，这些更新操作可能在 UI 渲染之前就已经完成，因此 UI 并不会立即反映这些更新。这可能导致 item.createTime 和 {{item.content}} 无法正确显示。

为了解决这个问题，你可以在更新 friendData 数组后手动调用 setData 方法来通知页面数据已经改变，需要重新渲染。你可以将 setData 方法添加到循环外部的回调函数中，以确保所有数据都已经更新后再重新设置页面数据，例如：

 

wx.request({
  // ... 其他配置
  success: function (res) {
    // ... 其他操作
    for (let j = 0; j < that.data.friendData.length; j++) {
      if (that.data.friendData[j].id === temp.userId || that.data.friendData[j].id === temp.targetUserId) {
        // 拼接数据
        that.data.friendData[j].createTime = temp.createTime;
        that.data.friendData[j].content = temp.content;
        console.log("+++++++++++++++++++++++++")
        console.log(that.data.friendData[j])
        console.log("+++++++++++++++++++++++++")
      }
    }
    // 更新页面数据
    that.setData({
      friendData: that.data.friendData
    });
  }
});