一、建立集合students
二、简单设计界面如下图
index.wxml如下：
<view>
<input placeholder="请输入账号" bindblur="getXh" />
<input placeholder="请输入姓名" bindblur="getMm" />
</view>
<view>
<view class="tr">
<view class="td">账号</view>
<view class="td">姓名</view>
</view>
<view class="tr" wx:for="{{list}}" wx:key="_id">
<view class="td">{{item.xh}}</view>
<view class="td">{{item.xm}}</view>
</view>
</view>
<view class="tr">
<button bindtap="yun">添加</button>
<button bindtap="remo">删除</button>
<button bindtap="upda">修改</button>
<button bindtap="sele">查询</button>
<button bindtap="ydisp">显示</button>
</view>
index.wxss如下：
.tr{
display: flex;
}
.td{
width: 10em;
}
三、index.js如下
let xhxh=""
let xmxm=""
Page({
data: {
list:[]
},
getXh:function(e){
xhxh=e.detail.value
},
getMm:function(e){
xmxm=e.detail.value
},
yun:function(){
//const db = wx.cloud.database().collection("users")
wx.cloud.callFunction({
name:'funcadd',
data:{
xh:xhxh,
xm:xmxm,
t:1
},
success:function(res){
wx.showToast({
title: '添加成功',
})
}
})
},
remo:function(){
wx.cloud.callFunction({
name:'funcadd',
data:{
xh:xhxh,
t:2
},
success:function(res){
wx.showToast({
title: '删除成功',
})
}
})
},
//按账号修改姓名
upda:function(){
wx.cloud.callFunction({
name:'funcadd',
data:{
xh:xhxh,
xm:xmxm,
t:3
},
success:function(res){
wx.showToast({
title: '修改成功',
})
}
})
},
//按账号查询
sele:function(){
wx.cloud.callFunction({
name:'funcadd',
data:{
xh:xhxh,
t:4
},
success: (res)=>{
//console.log(res.result.data)
this.setData({
list:res.result.data
})
}
})
},
ydisp:function(){
wx.cloud.callFunction({
name:'funcadd',
data:{
t:5
},
success: (res)=>{
//console.log(res.result.data)
this.setData({
list:res.result.data
})
}
})
},
})
四、云函数funcadd内容如下：
const cloud = require('wx-server-sdk')
cloud.init()
const db = cloud.database()
// 云函数入口函数
exports.main = async (event, context) => {
switch(event.t)
{
case 1:
db.collection('students').add({
data:{
xh:event.xh,
xm:event.xm
}
})
break;
case 2:
db.collection('students').where({
xh: event.xh
}).remove()
break;
case 3:
db.collection('students').where({
xh: event.xh
}).update(
{
data:{
xm:event.xm
}
}
)
break;
case 4:
return db.collection('students').where({
xh: event.xh
}).get()
break;
case 5:
return db.collection("students").get()
break;
}
}
五、几个执行效果图
1增加并显示
2按账号删除并显示
3按账号修改姓名并显示
4按账号查询
源代码已压缩上传
172
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
