1.前期准备
在使用云开发之前需要先在app.js中初始化云开发的配置,上一篇文章已经提到。连接:https://blog.csdn.net/beekim/article/details/120977861
在云开发的数据库中新建一个集合
app.json中配置一个新的页面,并设置入口页面,方便调试
微信官方文档中关于button
关于form
代码:
<!--pages/datatest/datatest.wxml-->
<text>数据库crud测试:</text>
<form bindsubmit="testData">
<label for="name"></label>
<input type="text" name="name" id="name" placeholder="输入用户名"/>
<label for="pass"></label>
<input type="text" name="pass" id="pass" placeholder="输入密码"/>
<label for="age"></label>
<input type="text" name="age" id="age" placeholder="输入年龄"/>
<button type="primary" form-type="submit">提交</button>
</form>
input{
border: 1rpx solid black;
margin: 10px 0;
}
testData(event){
console.log(event)
}
测试:
提交之后可以在控制台得到我们刚才表单填写的数据内容,接下来需要做的就是将这些信息和云开发的数据库交互起来
2.插入数据
初始化数据库
插入部分的代码参照官方文档来写
代码:
testData(event){
const db = wx.cloud.database()
console.log(event)
db.collection('datatest').add({
// data 字段表示需新增的 JSON 数据
data: {
name:event.detail.value.name,
pass:event.detail.value.pass,
age:event.detail.value.age
},
success: function(res) {
// res 是一个对象,其中有 _id 字段标记刚创建的记录的 id
console.log(res)
}
})
},
测试:
插入成功!
3.查询数据
为了方便测试,我多插入了几条数据。
需求:现在我需要将数据查询出来全部遍历输出在界面上
查询也参照官方文档来写
wxml中添加一段显示的代码:
<view>
<text>查询数据显示:</text>
<view>
<text wx:for="{{showdata}}">
{{item.name}}
</text>
</view>
</view>
data: {
showdata:''
},
testData(event){
const db = wx.cloud.database()
console.log(event)
db.collection('datatest').get({
success:res=> {
// res.data 包含该记录的数据
console.log(res.data)
this.setData({
showdata:res.data
})
}
})
},
测试:
点击按钮后,测试成功!
注意点:
官方文档写的这个doc属性表示的是id的值
如果要进行条件查询,可以写一个where
官网还提供了查询指令:
4.更新数据
修改成功!
或者把条件写成where
修改成功!
5.删除数据
中间也可以换成doc
6.其他
官方还提供了数据库的操作,详细见https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/database/query-array-object.html