本文将讲述小程序云开发对数据的增删改查等操作。
新增数据
查看官方文档
例子:
<button bindtap="add">添加数据</button>
add(){
// 获取云开发数据库调用
const db = wx.cloud.database()
db.collection('goods').add({
data:{
name:'测试数据',
count:1
},
success:res => {
// 返回结果是包含新创建记录的_id
console.log(res)
wx.showToast({
title:'添加成功'
})
console.log('res_id',res_id)
},
fail:err => {
wx.showToast({
icon: 'none',
title:'添加失败'
})
console.log('err',err);
}
})
}
上传文件
使用云开发的存储能力
wx.chooseImage选择图片
wx.cloud.uploadFile 上传图片
<button bindtap="upload">上传封面</button>
<image src="{{uploadUrl}}"></image>
upload(){
wx.chooseImage({
count:1,
sizeType: ['compress'],
sourceType:['album','camera'],
success :res => {
wx.showLoading({
title: '上传中'
})
const filePath = res.tempFilePaths[0];
console.log('filePath:',filePath);
// 上传图片
const cloudPath = 'my-image123'+filePath.match(/\.[^.]+?$/)[0]
console.log('cloudPath',cloudPath);
wx.cloud.uploadFile({ //云函数
cloudPath,
filePath,
success: res => {
console.log('[上传文件]成功',res);
this.setData({
uploadUrl: res.fileID //回传地址
})
},
complete: () => {
wx.hideLoading()
}
})
}
})
},
读取数据
在记录和集合上都有提供get方法用于获取单个记录或集合中多个记录的数据。
const db = wx.cloud.database();
db.collection('goods').get({
success: res=> {
console.log('res',res);
this.setData({goods:res.data});
}
})
更新数据
使用update更新数据,更新方式多样化,可以直接修改新的值,也支持递增这些函数操作。
const _ = db.command
db.collection('goods').doc('goodid').update({
data: {
//新的值
name: 'xx',
// 表示指示数据库将字段自增 10
count: _.inc(1)
},
success(res){
console.log(res.data)
}
})
下拉刷新
需要配置enablePullDownRefresh配合onPullDownRwfresh生命周期
onPullDownRefresh: function () {
console.log('onPullDownRefresh...');
},
触底加载
需要配置onReachBottomDistance配置onReachBottom
onReachBottom: function () {
console.log('onReachBottom...');
}
这两个配置项在对应的json文件内进行添加:
{
"usingComponents": {},
"enablePullDownRefresh":true,
"onReachBottomDistance":50
}
总结
这篇主要介绍了小程序云开发对云函数的使用,使用云函数新增数据、上传文件、读取数据、更新数据、页面的下拉刷新和触底加载事件等。