微信小程序宠物论坛3

微信小程序宠物论坛3

首页模块

界面

首页展示所有帖子，下拉可以刷新。

JS部分

// 初始化数据化
const db = wx.cloud.database();
const cont = db.collection('post');

Page({
  data:{
    post:[],//帖子
    postnum:0,//帖子数量
    fintime:'',
  },

 //下拉刷新加载数据
  onPullDownRefresh: function () {
  wx.showNavigationBarLoading()
    wx.hideNavigationBarLoading();
    
    const _ = db.command
    wx.cloud.callFunction({
      name: 'getpost',
      data: {
        mark: 'get'
      }
    }).then(res => {
      this.setData({
        post: res.result.data
      })
    }).catch(err => { })

    setTimeout(function () {
      wx.hideNavigationBarLoading() //完成停止加载
      wx.stopPullDownRefresh() //停止下拉刷新
    }, 1500);
  },

  onLoad: function (options) {
    
    wx.cloud.callFunction({
      name: 'getpost',
      data: {
        mark: 'get'
      }
    }).then(res => {
      this.setData({
        post:res.result.data
      })
    }).catch(err => { })

  }
})

WXML部分

  {{item.title}}
  
  
  
  
  
    
      {{item.nickname}}
        {{item.time}} 
  

WXSS部分

.title{
  font-weight: bold;
}
.desc{
font-size:70%;
}

.userinfo-avatar {
  width: 30rpx;
  height: 30rpx;
  border-radius: 50%;
}

.userinfo-nickname {
  font-weight:bold;
  font-size:75%;
  color: black;
  margin-bottom:30px;
}
.userinfo-time{
 font-size:65%;
 padding-bottom:40px
}

.line {
  border: 1px solid #ccc;
  opacity: 0.2;
}

.main{
  padding-left: 4%;
  padding-right: 4%
}