003 数据库初始化及查询

最新推荐文章于 2024-05-11 09:57:30 发布

原创最新推荐文章于 2024-05-11 09:57:30 发布 · 1.2k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#小程序

微信小程序专栏收录该内容

4 篇文章

订阅专栏

本文详细介绍了在小程序中使用云开发数据库进行数据的添加、初始化、权限设置、查询（包括传统方式和ES6写法）以及数据权限问题。同时，展示了如何在WXML中进行数据渲染，通过ES6的Promise简化了数据获取和更新的过程。最后，给出了简单的数据渲染示例，演示了如何将查询到的数据绑定到页面上。

1. 添加数据库

在这里插入图片描述

2. 手动添加一条数据

在这里插入图片描述

3. 数据库初始化

//数据库初始化
const db = wx.cloud.database()

云开发帮助文档
 初始化数据库

4. 数据权限

默认是仅创建者可读写 ERRO ：手动创建的数据在程序中无法被读取时由此原因造成
在这里插入图片描述

5. 传统数据查询

//连接数据库 传统查询数据
const goods = db.collection('goods').get({
  success(res) {
    console.log('SUCCESS', res)
  },
  fail(erro) {
    console.log('ERRO', erro)
  }
})

5-1 ES6写法数据查询

//数据库初始化 ES6
wx.cloud.database().collection('goods').get()
  .then(res => {
    console.log('SUCCESS', res)
  })
  .catch(erro => {
    console.log('ERRO', erro)
  })

5-2 ES6与传统写法的区别之this作用域

在传统写的写里面,success中想要改变数据的时候，需要创建一个中间变量将当前页面的this传递给中间变量然后再使用中间变量比如：

data:{
	list:[]
}
onLoad(){
	let that = this
	
	success(res){
		that.setData({
			list:res.data
		})
	}
}

在ES6的写法中这个问题就不再存在，所以有的时候减少不必要的错误，建议使用这种方式

wx.cloud.database().collection('goods').get()
	.then(res => {
	  console.log('SUCCESS', res.data)
	  this.setData({
	    list: res.data
	  })
	})
	.catch(erro => {
	  console.log('ERRO', erro)
	})

6 简单数据渲染

WXML

<view wx:for="{{list}}">
  <view>图书：{{item.name}}, 作者：{{item.auth}}</view>
</view>

  data: {
    list: []
  },

  onLoad: function (options) {
    //数据库初始化 ES6
    wx.cloud.database().collection('goods').get()
      .then(res => {
        console.log('SUCCESS', res.data)
        this.setData({
          list: res.data
        })
      })
      .catch(erro => {
        console.log('ERRO', erro)
      })
  },

在这里插入图片描述