使用LeanCloud快速開發一款小程序

時間 2019-11-21

原文原文鏈接

前言

開發小程序離不開後臺數據，對於獨立開發者來講，既要寫前端，又要寫後端，工做量就會驟然增大。微信提供的雲開發無疑是給獨立開發者提供了很大的便利，可是因爲其數據庫不支持聯表查詢，對於某些場景就不是那麼的友好了。固然，市面上有不少的BaaS服務提供商，大都相似，今天咱們就用其中的一個LeanCloud來說解一下，如何快速使用LeanCloud來開發一個小程序。因爲本次重點在LeanCloud，因此小程序的開發內容就不是重點。html

如今開始

帳號註冊

先去leancloud.cn官網註冊一個帳號，而後登陸去控制檯建立一個新應用。前端

域名配置

在微信小程序後臺中配置域名白名單，具體須要按照這裏說明的來配置，你也能夠先跳過這一步，等徹底開發完畢後再來配置。可在開發者工具的詳情 > 項目設置 中勾選不校驗安全域名、TLS 版本以及 HTTPS 證書。vue

SDK集成

下載你熟悉的SDK，目前支持JS，WePY，mpvue，下載連接在這裏，後面以JS來講明，其餘方式的SDK導入以及使用方法參考文檔中的說明。數據庫

初始化SDK

在app.js中加入如下代碼便可。appId和appKey能夠在控制檯中的應用找到。小程序

const AV = require('./utils/av-live-query-weapp-min');

AV.init({
  appId: '換成你本身的appId',
  appKey: '換成你本身的appKey',
});
複製代碼

查詢數據

先須要在控制檯中的應用下新建一個表，在網頁中叫作Class。每一張表會默認建立objectId、createdAt、updatedAt、ACL四個字段，分別表示數據索引，建立時間，更新時間、權限。你能夠添加你想要的字段，目前支持如下幾種類型。後端

其中Object是map對象，GeoPoint是經緯度信息，Pointer是另一張表的表名，作多表聯合查詢使用的。假設咱們的表名是T_TODO，咱們能夠用如下代碼來查詢該表下面的數據。微信小程序

new AV.Query('T_TODO')
      .descending('createdAt') // 排序
      .limit(10) // 分頁數量
      .skip(10) // 跳過數量
      .find()
      .then(function(results) {
      		that.setData({todo: results})
      })
      .catch(console.error);
  }
複製代碼

在你的WXML中能夠這樣寫來作數據綁定：安全

<!-- pages/todos/todos.wxml -->
<block wx:for="{{todos}}" wx:for-item="todo" wx:key="objectId">
<text data-id="{{todo.objectId}}">
  {{todo.content}}
</text>
</block>
複製代碼

是否是很方便。bash

多表查詢

若是須要多多表查詢，先要在一張表中新建一個Pointer字段，新建時會讓你選擇指向的表名，以下圖所示：微信

而後在查詢是使用 include，就會返回關聯表中的全部信息了，以下所示：

new AV.Query('T_TODO')
      .descending('createdAt') // 排序
      .limit(10) // 分頁數量
      .skip(10) // 跳過數量
      .include('T_POINT_CLASS')
      .find()
      .then(function(results) {
      		that.setData({todo: results})
      })
      .catch(console.error);
  }
複製代碼

更新對象

小程序中對錶中字段作操做後，須要同步更新到服務端，能夠使用如下代碼來保存對象。

// 第一個參數是 className，第二個參數是 objectId
  var todo = AV.Object.createWithoutData('Todo', '5745557f71cfe40068c6abe0');
  // 修改屬性
  todo.set('content', '每週工程師會議，本週改成周三下午3點半。');
  // 保存到雲端
  todo.save();
複製代碼