微信小程序開發入門之共享賬本（十二）

微信小程序開發入門之共享賬本（十二）

接著上一篇

（備註：微信小程序的wxml文件相當於HTML文件，wxss文件相當於CSS文件，js文件就是JavaScript文件，數據庫為NoSQL數據庫，數據庫腳本語言也同NoSQL）

區塊鏈最近可真是火，但是也不能因此亂了方寸，做事要有始有終不是，等寫完小程序的文章再和大家共同學習下區塊鏈的知識吧。

言歸正傳，上一篇完成了將記錄新增到數據庫以及實現頁面和組件間的通信，但是用到的集合時手動創建的臨時集合tempAccountBook，這肯定時不合理的，這一篇開始我們就把從第一次打開小程序到記錄第一筆賬的邏輯給捋順了。

首先把上一篇新建的臨時集合刪掉

放錯了，是這個

（要是肥肉能刪除該有多好啊）

當用戶首次打開程序的時候，我們會展示一個相當於登錄頁面的授權頁面，授權成功後才能進到主頁面，這時候還沒有任何賬本信息，我們有兩條路可選，一是提示用戶需要創建一個賬本，二是給用戶生成一個默認的，日後可以改賬本名稱。個人覺得第二種好些，很多人人就是不喜歡起名字，給個默認賬本讓其無感知的進行記賬就很好，可以稍微提示下如何修改賬本名稱，總之儘量讓用戶做最少的工作和選擇肯定是對的。

確定了思路，接下來看下代碼邏輯該怎麼走

welcome頁面用來登錄，登陸的雲函數login中就有是否已存在用戶信息的邏輯，那我們將新增默認賬本的邏輯也加進去

可事實上有個問題，如果第一次新建賬本失敗了，後面就會沒有機會再建賬本了，因為已經授權的用戶不會再走到

welcome界面

同樣的問題也存在於新建用戶的邏輯，如果授權成功但是新建用戶信息失敗了也不會有其他入口再重試

當然在welcome頁面的邏輯中完成用戶信息和新建賬本沒有什麼問題，只是需要在主頁面index.js的邏輯中再檢測一次

首先看下賬本信息表的結構

我們可以用creatorId來查詢該用戶是否已經創建過賬本，如果沒有則新建一個默認賬本，賬本名稱格式為"openid@默認賬本"

先在數據庫中新建一個集合acctBook

然後修改下雲函數login的index.js代碼，如下

exports.main = async (event, context) => {
 let user = event.user
 user.openId = event.userInfo.openId
 let r1 = await db.collection('user').where({
 openId:user.openId
 }).get()
 let r2 = await db.collection('acctBook').where({
 openId: user.openId
 }).get()
 if(r1.data.length < 1){
 r1 = db.collection('user').add({
 data: user
 })
 }
 if(r2.data.length < 1){
 r2 = db.collection('acctBook').add({
 data:{
 openId: user.openId,
 name: user.openId+'@默認賬本',
 partners:[{
 openId: user.openId,
 name: user.name,
 avatarUrl: user.avatarUrl,
 backgroundUrl:''
 }],
 active:true,
 createTime:new Date(),
 iconUrl:''
 }
 })
 }
 return Promise.all([r1,r2])
}

解釋下這裡的邏輯，首先是根據openid查詢user集合和acctBook集合看看是否已經存在數據，如果user集合或者acctBook集合沒有數據的話就插入新的數據

Promise.all([r1, r2])是當r1和r2兩個異步調用都返回成功才算成功，如果有一個失敗就是失敗，當r1和r2是常量時也算成功，所以在這裡不管是查詢到了數據或者是成功向數據庫插入數據，都能以此正確的向前端返回結果

編譯運行，演示如下

再去數據庫看看是否已經插入數據成功

user集合的數據沒有問題，再看看acctBook集合

賬本名稱用了默認生成的名稱，partners也將自身加了進去

很好，都沒問題，我們繼續

然後我們新建一個雲函數verify，用在主頁面中驗證信息是否初始化成功，修改verify的index.js代碼如下

// 雲函數入口文件
const cloud = require('wx-server-sdk')
cloud.init()
const db = cloud.database()
// 雲函數入口函數
exports.main = async (event, context) => {
 openId = event.userInfo.openId
 let r1 = await db.collection('user').where({
 openId: openId
 }).get()
 let r2 = await db.collection('acctBook').where({
 openId: openId
 }).get()
 if(r1.data.length < 1 || r2.data.length < 1){
 return Promise.reject('驗證失敗')
 } else {
 return Promise.resolve(r2.data)
 }
}

基本上是複用login中的內容，只是在用戶信息或者賬本信息之一不存在是返回失敗，否則返回賬本信息（後面需要用到）

然後再看主頁面index.js中的代碼，首先data中增加一個字段記錄用戶暱稱

name:''

然後新增一個函數，也叫verify，用來驗證信息

verify: function () {
 let r = wx.cloud.callFunction({
 name:'verify'
 })
 r.then(res => {
 wx.showToast({
 title: "歡迎你," + this.data.name,
 image: '/images/smile.png'
 })
 }).catch(err => {
 wx.redirectTo({
 url: '../welcome/welcome',
 })
 })
}

最後修改下onLoad中判斷授權成功的邏輯，將之前內容刪除改為調用verify函數即可

wx.getUserInfo({
 success: res => {
 //新建用戶信息或者查詢已有信息
 this.setData({
 name:res.userInfo.nickName
 })
 this.verify()
}
})

正常情況程序肯定不會有問題，現在我們測一下異常情況，可以去數據庫中把

user集合的信息刪掉，然後再回來重新編譯運行程序，不出意外會跳轉到登錄界面，點擊按鈕後會重新回到主頁面，然後再看數據庫中user集合，數據又重新添加進去了

歐克，今日份代碼完成，下一篇講如何實時更新賬單顯示