vue3.0中使用web雲開發（1）

這篇我就說說最近我在學習的web雲開發

需要使用雲開發功能首先得開通雲開發環境

• 雲開發環境開通可以看官方文檔 環境開通

環境開通后得在本地安裝Cloudbase CLI

npm install -g @cloudbase/cli

安裝成功后在項目中安裝tcb-js-sdk（官方說tcb-js-sdk改名了並且不在維護所以使用@cloudbase/js-sdk）

npm install tcb-js-sdk

yarn add @cloudbase/js-sdk 或者使用 npm install @cloudbase/js-sdk

• tcb-js-sdk的詳細使用可以看npm文檔地址

• cloudbase/js-sdk 文檔地址

在vue3.0中的使用

• 在寫代碼之前得在登錄授權中將匿名登錄開啟
  

• vue3.0的setup函數在beforecreate之后created之前，我是直接在setup函數中使用的

<script>
import cloudbase from "@cloudbase/js-sdk";
export default {
setup() {
    const app = cloudbase.init({
      env: "你的環境id"
    });
    const auth = app.auth({ persistence: "local" });
    auth
      .anonymousAuthProvider()
      .signIn()
      .then(() => {
        console.log("匿名登錄成功");
      })
      .catch(err => {
        console.log(err);
      });

}
<script/>

• 連接數據庫

<script>
import cloudbase from "@cloudbase/js-sdk";
export default {
setup() {
    const app = cloudbase.init({
      env: "你的環境id"
    });
    const auth = app.auth({ persistence: "local" });
    auth
      .anonymousAuthProvider()
      .signIn()
      .then(() => {
        console.log("登錄成功");
        //在登錄成功的回調中連接數據庫
        const db = app.database();  
        db.collection("test").where({name: 'boyyang'}).get()  
      })
      .catch(err => {
        console.log(err);
      });

}
<script/>

• 數據庫功能需要在登錄成功后才可以使用