置顶把数据库的内容变成真实的数据，数据库有内容，但界面不显示数据内容？精选热门

2022-07-284780浏览问题模块： API和组件

上面这个图显示不出内容出来，打印数据库有数据存在，另外就时间怎么显示是NaN?求各位大神帮忙解决下。代码如下：

<!--index.wxml-->
<wxs src="../../utils/util.wxs" module="util"/>
<view class="container">
 
  <view class="weibo-group" wx:for="{{weibos}}" wx:key="weibos" wx:for-item="{{weibo}}">
    <view class="user-group">
      <image class="avatar" src="{{weibo.author.avatarUrl}}"></image>
      <view class="right-info">
        <view class="username">{{weibo.author.nickName}}</view>
        <view class="detail-info">
          <view class="time">{{util.timeFormat(weibo.cretae_time)}}</view>
          <view class="from">来自{{weibo.device}}</view>
        </view>
      </view>
    </view>
    <view class="weibo-content-group">
      <view class="content">{{weibo.content}}</view>
      <block wx:if="{{weibo.images.length > 0}}">
        <!--1张图片的情况-->
        <view wx:if="{{weibo.images.length === 1}}" class="image-list-group">
          <image src="cloud://cloud1-9gsfk1on13e42e66.636c-cloud1-9gsfk1on13e42e66-1305874669/images/yingshiji.png" mode="aspectFill" style="width:100%;max-height:400rpx;" />
        </view>
        <!--2张和4张图片的情况-->
        <view wx:elif="{{weibo.images.length === 2 || weibo.images.length === 4}}" class="image-list-group">
          <image wx:for="{{weibo.images}}" wx:key="key" wx:for-item="image" src="{{image}}" mode="aspectFill" style="width:{{twoImageSize}}px;height:{{twoImageSize}}px;" />
        </view>
        <!--3张图片的情况-->
        <view wx:else class="image-list-group">
          <image wx:for="{{weibo.images}}" wx:key="key" wx:for-item="image" src="{{image}}" mode="aspectFill" style="width:{{threeImageSize}}px;height:{{threeImageSize}}px;" />
        </view>
      </block>
      <!--视频的情况-->
      <block wx:if="{{weibo.video}}">
        <view class="image-list-group">
          <video src="{{weibo.video}}"></video>
        </view>
      </block>
    </view>
    <view class="weibo-handle">
      <view class="comment-group">
        <image src="../../images/comment.png" />评论
      </view>
      <view class="praise-group">
        <image src="../../images/praise.png" />赞
      </view>
    </view>
  </view>
  <!--2张和4张图片的情况-->
  <!--<view class="weibo-group">
    <view class="user-group">
      <image class="avatar" src="cloud://cloud1-9gsfk1on13e42e66.636c-cloud1-9gsfk1on13e42e66-1305874669/images/1.jpg"></image>
      <view class="right-info">
        <view class="username">forry1</view>
        <view class="detail-info">
          <view class="time">2019/1/1 11:11:11</view>
          <view class="from">来自iphone XR</view>
        </view>
      </view>
    </view>
    <view class="weibo-content-group">
      <view class="content">大家快来学习小程序开发</view>
      <view class="image-list-group">
        <image src="cloud://cloud1-9gsfk1on13e42e66.636c-cloud1-9gsfk1on13e42e66-1305874669/images/yingshiji.png" mode="aspectFill" style="width:{{twoImageSize}}px;height:{{twoImageSize}}px;" />
        <image src="cloud://cloud1-9gsfk1on13e42e66.636c-cloud1-9gsfk1on13e42e66-1305874669/images/yingshiji.png" mode="aspectFill" style="width:{{twoImageSize}}px;height:{{twoImageSize}}px;" />
        <image src="cloud://cloud1-9gsfk1on13e42e66.636c-cloud1-9gsfk1on13e42e66-1305874669/images/yingshiji.png" mode="aspectFill" style="width:{{twoImageSize}}px;height:{{twoImageSize}}px;" />
        <image src="cloud://cloud1-9gsfk1on13e42e66.636c-cloud1-9gsfk1on13e42e66-1305874669/images/yingshiji.png" mode="aspectFill" style="width:{{twoImageSize}}px;height:{{twoImageSize}}px;" />
      </view>
    </view>
    <view class="weibo-handle">
      <view class="comment-group">
        <image src="../../images/comment.png" />评论
      </view>
      <view class="praise-group">
        <image src="../../images/praise.png" />赞
      </view>
    </view>
  </view>-->
  <!--3张图片的情况-->
  <!--<view class="weibo-group">
    <view class="user-group">
      <image class="avatar" src="cloud://cloud1-9gsfk1on13e42e66.636c-cloud1-9gsfk1on13e42e66-1305874669/images/1.jpg"></image>
      <view class="right-info">
        <view class="username">forry1</view>
        <view class="detail-info">
          <view class="time">2019/1/1 11:11:11</view>
          <view class="from">来自iphone XR</view>
        </view>
      </view>
    </view>
    <view class="weibo-content-group">
      <view class="content">大家快来学习小程序开发</view>
      <view class="image-list-group">
        <image wx:for="{{images}}" wx:key="key" src="cloud://cloud1-9gsfk1on13e42e66.636c-cloud1-9gsfk1on13e42e66-1305874669/images/yingshiji.png" mode="aspectFill" style="width:{{threeImageSize}}px;height:{{threeImageSize}}px;" />
        <view wx:if="{{images.length%3 == 2}}" style="width:{{threeImageSize}}px;height:{{threeImageSize}}px;"></view>
      </view>
    </view>
    <view class="weibo-handle">
      <view class="comment-group">
        <image src="../../images/comment.png" />评论
      </view>
      <view class="praise-group">
        <image src="../../images/praise.png" />赞
      </view>
    </view>
  </view>-->
   <!--视频的情况-->
   <!-- <view class="weibo-group">
    <view class="user-group">
      <image class="avatar" src="cloud://cloud1-9gsfk1on13e42e66.636c-cloud1-9gsfk1on13e42e66-1305874669/images/1.jpg"></image>
      <view class="right-info">
        <view class="username">forry1</view>
        <view class="detail-info">
          <view class="time">2019/1/1 11:11:11</view>
          <view class="from">来自iphone XR</view>
        </view>
      </view>
    </view>
    <view class="weibo-content-group">
      <view class="content">大家快来学习小程序开发</view>
      <view class="image-list-group">
        <video src="cloud://cloud1-9gsfk1on13e42e66.636c-cloud1-9gsfk1on13e42e66-1305874669/video/汽车视频.mp4"></video>
      </view>
    </view>
    <view class="weibo-handle">
      <view class="comment-group">
        <image src="../../images/comment.png" />评论
      </view>
      <view class="praise-group">
        <image src="../../images/praise.png" />赞
      </view>
    </view>
  </view>-->
</view>
<view class="write-weibo-btn" bind:tap="onWriteWeiboTap">
  <view>+</view>
</view>
index.js代码如下：
//index.js
const app=getApp()
const db = wx.cloud.database()
Page({

  /**
   * 页面的初始数据
   */
  data: {
    images:[1,2,3,4,5,6,7,8,9]
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    this.initImageSize()
    this.loadWeibos()
    // this.onWriteWeiboTap()
  },
  loadWeibos:function(){
    const that = this;
     db.collection("weibo").limit(10).get().then(res=>{
      //  console.log(res);
      const weibos = res.data;
      console.log(weibos);
      that.setData({
         weibos:weibos
      })
     })
  },
时间代码如下：
// var weekdays = [
//   '星期一',
//   '星期二',
//   '星期三',
//   '星期四',
//   '星期五',
//   '星期六',
//   '星期天'
// ]
// a=10;
// console.log(a);
var timeFormat = function(time){
  var date = getDate(time);
  var date_seconds = date.getTime() / 1000;
  var now = getDate();
  var now_seconds = now.getTime() / 1000;
  var timestamp = now_seconds - date_seconds;
  var timeStr = "";
  if(timestamp < 60){
    timeStr = "刚刚";
  }else if(timestamp >= 60 && timestamp < 60 * 60){
    var minutes = parseInt(timestamp / 60);
    timeStr = minutes + "分钟前";
  }else if(timestamp >= 60 * 60 && timestamp < 60 * 60 * 24){
  var hours = parseInt(timestamp / 60 / 60);
  timeStr = hours + "小时前";
  }else if(timestamp >= 60 * 60 * 24 && timestamp < 60 * 60 * 24 * 30){
    var days = parseInt(timestamp / 60 / 60 / 24);
    timeStr = days + "天前";
  }else{
    var year = date.getFullYear();
    var month = date.getMonth();
    var day = date.getDate();
    var hour = date.getHours();
    var minute = date.getMinutes();
    timeStr = year + "/" + month + "/" + day + " " + hour + ":" + minute;
  }
  return timeStr;
}
module.exports={
  timeFormat:timeFormat,
  // weekdays:weekdays
}

置顶把数据库的内容变成真实的数据，数据库有内容，但界面不显示数据内容？精选热门

请选择投诉理由

删除当前帖子

删除后帖子内容及评论将一并被删除，且不可恢复。

关注“微信开放社区”公众号

反馈

新增或编辑超链接

插入视频

新增或编辑超链接

插入视频

请选择投诉理由

请选择投诉理由

新增或编辑超链接

插入视频

新增或编辑超链接

插入视频

请选择投诉理由

请选择投诉理由

新增或编辑超链接

插入视频

关注“微信开放社区”公众号