首先要在需要获取并显示数据的page的js文件中使用如下代码获取数据:

//云数据库初始化
const db = wx.cloud.database({});
const cont = db.collection('river_data');

Page({
   data:{
        ne:[],  //这是一个空的数组,等下获取到云数据库的数据将存放在其中
    },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    var _this = this;
    //1、引用数据库   
    const db = wx.cloud.database({
      //这个是环境ID不是环境名称     
      env: '环境ID'
    })
    //2、开始查询数据了  news对应的是集合的名称   
    db.collection('集合名称').get({
      //如果查询成功的话    
      success: res => {
        console.log(res.data)
        //这一步很重要,给ne赋值,没有这一步的话,前台就不会显示值      
        this.setData({
          ne: res.data
        })
      }
    })
  },    
})

 

然后在此page的wxml文件中使用如下代码展示数据

 

<view class='a' wx:for="{{ne}}"><!--wx:for是微信数据绑定的一种方式,该数组有多少数据就显示多少个view-->
    <!--index为每个数据对应的下标-->
    <view >序号:{{index+1}}</view>
    <!--item就相当于数组名+下标的结合体,适用于调用数组所有数据-->
    <view>{{item.name}}</view>
    <view >{{item.age}}</view>
    <view >{{item.sex}}</view>
</view>
Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐