<span id="h9j9p"><th id="h9j9p"><th id="h9j9p"></th></th></span>
<sub id="h9j9p"><listing id="h9j9p"></listing></sub>

    <noframes id="h9j9p"><form id="h9j9p"></form>
    <form id="h9j9p"></form>
      <sub id="h9j9p"><dfn id="h9j9p"><menuitem id="h9j9p"></menuitem></dfn></sub>

      <form id="h9j9p"><nobr id="h9j9p"><meter id="h9j9p"></meter></nobr></form>
        400-650-7353

        精品課程

        您所在的位置:首頁 > IT干貨資料 > web前端 > 【Web前端基礎知識】微信小程序之云開發

        【Web前端基礎知識】微信小程序之云開發

        • 發布: Web前端培訓
        • 來源:
        • 2021-08-30 17:15:21
        • 閱讀()
        • 分享
        • 手機端入口

        一、如何開通云開發

        1、新建小程序模板,選擇自己實際的AppId,選擇云開發

        2、進入編譯器,點擊云開發,即可進入購買,注意!!,云開發會免費贈送兩套環境供用戶使用。

        3、查看環境ID,在云開發設置中查看

        二、云能力初始化

        創建完項目后,會有兩個文件夾,cloudfunctions和miniprogram,cloudfunctions存放云函數的文件夾,而miniprogram為我們本地項目,我們在miniprogram中的app.js 初始云函數

        1. App({   
        2.   onLaunch: function () {   
        3.     if (!wx.cloud) {   
        4.       console.error('請使用 2.2.3 或以上的基礎庫以使用云能力')   
        5.     } else {   
        6.       wx.cloud.init({   
        7.         // env 參數說明:   
        8.         //   env 參數決定接下來小程序發起的云開發調用(wx.cloud.xxx)會默認請求到哪個云環境的資源   
        9.        //   此處請填入環境 ID, 環境 ID 可打開云控制臺查看   
        10.         //   如不填則使用默認環境(第一個創建的環境)   
        11.         env: '自己的環境ID',//注意。!在云開發設置中查看   
        12.         traceUser: true,   
        13.       })   
        14.     }   
        15.   }   

        三、云開發中基本的增刪改查

        1、添加數據,代碼中users為數據庫表的名字,data寫想要添加的參數

        1. //引入數據庫   
        2. let db = wx.cloud.database()   
        3.     db.collection("users").add({   
        4.       data:{   
        5.             //想添加的參數   
        6.       },   
        7.       success(res){   
        8.         console.log(res);//成功的回調   
        9.     }   
        10.     })   

        2、獲取數據

        (1)獲取全部

        1. //引入數據庫   
        2. let db = wx.cloud.database()   
        3.   //異步獲取   
        4.     db.collection("users").get({   
        5.       success(res){   
        6.         console.log(res);   
        7.       }   
        8.     })    
        9.     // 同步獲取--同步獲取需要在方法前寫async   
        10.     let res = await db.collection("users").get() 

        (2)通過條件獲取

        1. //引入數據庫   
        2. let db = wx.cloud.database()   
        3.   //異步獲取   
        4.     db.collection("users").where( 查詢的條件 ).get({   
        5.       success(res){   
        6.         console.log(res);   
        7.       }   
        8.     })    
        9.     // 同步獲取--同步獲取需要在方法前寫async   
        10.     let res = await db.collection("users").where( 查詢的條件 ).get()    

        3、修改數據

        (1)通過id修改,獲取完數據時自帶id,可以通過自帶的id修改

        1. //引入數據庫   
        2.         let db = wx.cloud.database()   
        3.        db.collection('users').doc(id).update({   
        4.             data: {   
        5.                 userVal: "admins" //想要修改的內容  
        6.             }, //修改的內容   
        7.             success(res) {   
        8.                console.log(res)   
        9.             }   
        10.         })   

        (2)通過where條件修改

        1. //引入數據庫   
        2.         let db = wx.cloud.database()   
        3.   
        4.        db.collection('users').where(條件--如:{userVal:admin}).update({   
        5.             data: {   
        6.                userVal: "admins"   
        7.            }, //修改的內容   
        8.            success(res) {   
        9.                 console.log(res)   
        10.            }   
        11.        })   

        4、刪除數據

        (1)通過id刪除

        1. //引入數據庫   
        2.       let db = wx.cloud.database()   
        3.   
        4.       db.collection('users').doc(id).remove({   
        5.             success(res) {   
        6.                console.log(res)   
        7.          }   
        8.         })   

        (2)通過where刪除 -- 注意!(在小程序端不能刪除多條,必須在云端進行)

        1. //引入數據庫   
        2.        let db = wx.cloud.database()   
        3.    
        4.       db.collection('users').where(條件,如:{uesrVal:admin}).remove({   
        5.            success(res) {   
        6.                console.log(res)   
        7.            }   
        8.        })   

        四、應用云開發,上傳用戶名和密碼小案例

        1、index.wxml文件

        1. <input type="text" model:value="{{userVal}}" placeholder="用戶名" />   
        2. <input type="text" model:value="{{passVal}}" placeholder="密碼" /> 
        3. <button bindtap="addUser">添加</button>   

        2、index.js文件

        1. let db = wx.cloud.database()//使用云數據庫需要使用這個api調用   
        2. Page({   
        3.   data: {   
        4.     userVal: "",   
        5.     passVal: ""   
        6.   },   
        7.  addUser() {   
        8.     //拿到表單里面的值   
        9.     let {   
        10.       userVal,   
        11.       passVal   
        12.    } = this.data   
        13.     //引用數據庫     
        14.    // 數據庫添加操作 -- 異步操作   
        15.    //users是云開發里面數據庫的表名(數據庫在云開發點加號自行創建),data里面為需要添加的參數,success回調函數可以查看是否成功   
        16.     db.collection("users").add({   
        17.      data: {   
        18.        userVal,   
        19.        passVal   
        20.      },   
        21.      success(res) {   
        22.        console.log(res);   
        23.     }   
        24.    })       
        25.  },   
        26. })   

        學習疑問申請解答
        您的姓名
        您的電話
        意向課程
         

        中公優就業

        IT小助手

        掃描上方二維碼添加好友,請備注:599,享學習福利。

        >>本文地址:
        注:本站稿件未經許可不得轉載,轉載請保留出處及源文件地址。

        推薦閱讀

        優就業:ujiuye

        關注中公優就業官方微信

        • 關注微信回復關鍵詞“大禮包”,享學習福利
        QQ交流群
        在線疑問解答
        (加群備注“網站”)
        IT培訓交流群 加入群聊 +
        軟件測試 加入群聊 +
        全鏈路UI/UE設計 加入群聊 +
        Python+人工智能 加入群聊 +
        互聯網營銷 加入群聊 +
        Java開發 加入群聊 +
        PHP開發 加入群聊 +
        VR/AR游戲開發 加入群聊 +
        大前端 加入群聊 +
        大數據 加入群聊 +
        Linux云計算 加入群聊 +
        優就業官方微信
        掃碼回復關鍵詞“大禮包”
        享學習福利

        測一測
        你適合學哪門IT技術?

        1 您的年齡

        2 您的學歷

        3 您更想做哪個方向的工作?

        獲取測試結果
         
        課程資料、活動優惠 領取通道
         
         
        亚洲日韩中文字幕一区
        <span id="h9j9p"><th id="h9j9p"><th id="h9j9p"></th></th></span>
        <sub id="h9j9p"><listing id="h9j9p"></listing></sub>

          <noframes id="h9j9p"><form id="h9j9p"></form>
          <form id="h9j9p"></form>
            <sub id="h9j9p"><dfn id="h9j9p"><menuitem id="h9j9p"></menuitem></dfn></sub>

            <form id="h9j9p"><nobr id="h9j9p"><meter id="h9j9p"></meter></nobr></form>