winform调用webservice增删查改_教你分别用数据库与云函数实现“增删查改”
導(dǎo)語
數(shù)據(jù)庫 API 與云函數(shù)“增刪查改”的姿勢有何不同?對比代碼差異往往有助于更好的理解,本文用詳細(xì)代碼幫你尋找答案并鞏固基礎(chǔ)!
?▌一、云開發(fā)初始化
wx.cloud.init({
env: 'wedding-10c111'
})
上面這段代碼配置在src目錄下的main.js文件中。
▌二、數(shù)據(jù)庫API(不使用云函數(shù)進(jìn)行“增刪查改”)
以下說明均寫在對應(yīng)代碼注釋里,不清楚的請查看相關(guān)注釋。
查(獲取數(shù)據(jù))
// 獲取輪播圖列表
getBannerList () {
// 獲取數(shù)據(jù)庫引用
const db = wx.cloud.database()
// 獲取名為“banner”的集合引用
const banner = db.collection('banner')
// 獲取集合(Promise 風(fēng)格)
banner.get().then(res => {
this.list = res.data[0].bannerList
})
}
對應(yīng)實例如下:
注意:之所以數(shù)據(jù)庫只有一條數(shù)據(jù),而把banner列表當(dāng)成這條數(shù)據(jù)的一個字段存儲,其目的是為了自己后續(xù)換圖操作的方便。
增(添加數(shù)據(jù))
// 添加用戶
addUser () {
// 獲取數(shù)據(jù)庫引用
const db = wx.cloud.database()
// 獲取名為“user”的集合引用
const user = db.collection('user')
// 向“user”集合中添加一條數(shù)據(jù)(Promise 風(fēng)格)
user.add({
data: {
user: that.userInfo,
// 構(gòu)造一個服務(wù)端時間的引用,我的項目中都是取自己轉(zhuǎn)化后的時間,
// 取這個時間更加合理,可用于查詢條件、更新字段值或新增記錄時的字段值
time: db.serverDate()
}
}).then(res => {
// 添加成功后重新查詢列表
that.getUserList()
})
}
對應(yīng)實例如下:
注意:可以看出_id和_openid是添加完自動生成的屬性。
改(修改數(shù)據(jù))
// 改變某條留言的顯示隱藏
switchMessage (e) {
// 獲取數(shù)據(jù)庫的引用
const db = wx.cloud.database()
// 獲取名為“message”的集合的引用
const message = db.collection('message')
// 這里的id是拿到當(dāng)前操作項對應(yīng)的id,
// 這里的show對應(yīng)change事件傳遞過來的值
message.doc(e.mp.target.dataset.id).update({
data: {
show: e.mp.detail.value
}
}).then(res => {
console.log(res)
})
}
對應(yīng)實例如下:
注意:這個界面在你們使用的小程序中是看不到的,只有本人才有權(quán)限查看。
class="switch" :data-id="item._id" :checked="item.show" @change="switchMessage">
注意:上面我們之所以能得到e.mp.target.dataset.id是因為在標(biāo)簽上加了:data-id="item._id",否則取不到對應(yīng)id。
刪(刪除數(shù)據(jù))
正好對應(yīng)的上圖有刪除操作。
deleteItem (id) {
// 記錄this指向
const that = this
// 這里之所以使用wx.showModal是防止誤操作
wx.showModal({
title: '提示',
content: '你確定要刪除這條留言?',
success (res) {
if (res.confirm) {
// 獲取數(shù)據(jù)庫的引用
const db = wx.cloud.database()
// 獲取名為“message”集合的引用
const message = db.collection('message')
// 刪除操作(Promise 風(fēng)格)
message.doc(id).remove().then(res => {
// 刪除成功后再次請求列表,達(dá)到刷新數(shù)據(jù)的目的
if (res.errMsg === 'document.remove:ok') {
that.getList()
}
})
}
}
})
}
▌三、使用云函數(shù)進(jìn)行增刪改查
查(獲取數(shù)據(jù))
// 云函數(shù)初始化
const cloud = require('wx-server-sdk')
// 由于文章開始已經(jīng)講過初始化步驟,這里init(options)的options可以省略
// options參數(shù)定義了云開發(fā)的默認(rèn)配置,該配置會作為之后調(diào)用其他所有云 API 的默認(rèn)配置
cloud.init()
// 獲取數(shù)據(jù)庫的引用
const db = cloud.database()
exports.main = async (event, context) => {
// 將集合名定義成一個變量,方便后續(xù)調(diào)用
const dbName = 'message'
// filter為指定的篩選條件,配合where()使用
const filter = event.filter ? event.filter : null
// pageNum如果小程序端未傳入則默認(rèn)為1
const pageNum = event.pageNum ? event.pageNum : 1
// pageSize如果小程序端未傳入則默認(rèn)是10
const pageSize = event.pageSize ? event.pageSize : 10
// 數(shù)據(jù)庫滿足filter條件的數(shù)據(jù)總條數(shù)
const countResult = await db.collection(dbName).where(filter).count()
const total = countResult.total
// 共多少頁
const totalPage = Math.ceil(total / pageSize)
// 是否有下一頁
let hasMore
if (pageNum >= totalPage) {
hasMore = false
} else {
hasMore = true
}
// 等待所有,orderBy()通過創(chuàng)建時間排序,查詢單頁數(shù)據(jù)
return db.collection(dbName).orderBy('time', 'desc').where(filter).skip((pageNum - 1) * pageSize).limit(pageSize).get().then(res => {
// 返回結(jié)果中順帶注入hasMore和total方便小程序端判斷
res.hasMore = hasMore
res.total = total
return res
})
}
getList () {
// 記錄this指向
const that = this
// 每次調(diào)用getList時重新從第一頁開始
that.pageNum = 1
// 每次調(diào)用getList時,先將authorityList置空
that.authorityList = []
wx.cloud.callFunction({
// 云函數(shù)名
name: 'authorityList',
// 傳入云函數(shù)的參數(shù)
data: {
// 查詢的默認(rèn)篩選條件,這里可以參考下面留言審核對應(yīng)的兩張圖來看,左上角有個switch開關(guān)
// 當(dāng)開關(guān)開啟時,filter:{show:false}生效
filter: that.checkFlag ? {
show: false
} : null,
// 查詢頁數(shù)
pageNum: that.pageNum,
// 每頁條數(shù)
pageSize: that.pageSize
}
}).then(res => {
// 配合下拉刷新使用,作用是停止刷新事件
wx.stopPullDownRefresh()
// 以下動作為賦值操作
const temp = res.result
that.total = temp.total
that.hasMore = temp.hasMore
that.authorityList = temp.data
})
}
上面代碼對應(yīng)實例如下:1.查詢未通過審核的留言;2.查詢?nèi)康牧粞浴?/p>
增(添加數(shù)據(jù))
// 前面講解過的注釋之后的代碼將不重復(fù)說明
const cloud = require('wx-server-sdk')
cloud.init()
const db = cloud.database()
exports.main = async (event, context) => {
const dbName = 'message'
// 添加數(shù)據(jù)
return db.collection(dbName).doc(event.id).add({
data: {
desc: event.desc,
type: event.type,
show: event.show,
time: event.time,
url: event.url,
name: event.name
}
})
}
sendMessage () {
const that = this
if (that.desc) {
wx.cloud.callFunction({
// 云函數(shù)名
name: 'addMessage',
data: {
desc: that.desc,
type: 'message',
show: false,
time: utils.getNowFormatDate(),
url: that.userInfo.avatarUrl,
name: that.userInfo.nickName
}
}).then(res => {
// 關(guān)閉所有頁面,打開到應(yīng)用內(nèi)的某個頁面,跳轉(zhuǎn)到留言列表頁
wx.reLaunch({
url: '/pages/message/main'
})
})
} else {
tools.showToast('說點什么吧~')
}
}
對應(yīng)實例如下:
改(修改數(shù)據(jù))
const cloud = require('wx-server-sdk')
cloud.init()
const db = cloud.database()
exports.main = async (event, context) => {
const dbName = 'message'
return db.collection(dbName).doc(event.id).update({
data: {
show: event.show
}
})
}
switchMessage (e) {
const that = this
wx.cloud.callFunction({
name: 'switchMessage',
data: {
id: e.mp.target.dataset.id,
show: e.mp.detail.value
}
}).then(res => {
if (res.result.errMsg === 'document.update:ok') {
that.getList()
}
})
}
對應(yīng)實例如下:(前面沒使用云函數(shù)也實現(xiàn)了相同的功能,感興趣的可以對比查閱)
刪(刪除數(shù)據(jù))
const cloud = require('wx-server-sdk')
cloud.init()
const db = cloud.database()
exports.main = async (event, context) => {
const dbName = 'message'
return db.collection(dbName).doc(event.id).remove()
}
deleteItem (id) {
// 記錄this指向
const that = this
// 這里之所以使用wx.showModal是防止誤操作
wx.showModal({
title: '提示',
content: '你確定要刪除這條留言?',
success (res) {
if (res.confirm) {
wx.cloud.callFunction({
name: 'deleteMessage',
data: {
id
}
}).then(res => {
if (res.result.errMsg === 'document.remove:ok') {
that.getList()
}
})
}
}
})
}
對應(yīng)實例如下:
▌四、總結(jié)
掌握上面兩種對應(yīng)的增刪改查后,相信大家對云開發(fā)會有一個更清晰的認(rèn)識,也希望大家多多使用云開發(fā)做出更多好玩的小程序作品。
▌五、案例小程序
歡迎大家體驗:
??更多精彩?
點擊下方圖片即可閱讀
云開發(fā),不止于「快」
云開發(fā)
Tencent CloudBase
? ? ? 點擊在看讓更多人發(fā)現(xiàn)精彩
總結(jié)
以上是生活随笔為你收集整理的winform调用webservice增删查改_教你分别用数据库与云函数实现“增删查改”的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 5图片展示_跃进小型宣传车价格 图片 配
- 下一篇: linux cmake编译源码,linu