小程序云開發出來之后，小程序開發人員也要慢慢的接觸后端對數據的增刪改查了。下面就給大家提供一個案例吧。

這里我把新增和修改放在了一個頁面

顯示頁面index.wxml

<view wx:if="{{books}}" class='container'>    <view class='title'>     <text>圖書列表</text>    </view>    <view class='label'>     <text>書名</text>     <text>作者</text>     <text>價格</text>     <text>操作</text>    </view>   <block wx:for="{{books}}" wx:key="">      <view class='content'>       <text>{{item.name}}</text>       <text>{{item.author}}</text>       <text>{{item.price}}</text>       <button class='del' data-id='{{item._id}}' bindtap='onDel'>刪除</button>       <button class='update' data-id='{{item._id}}' bindtap='onUpdate'>修改</button>     </view>   </block></view><view wx:else="{{books}}" class='none'>   <text >暫時沒有圖書！</text></view><view class='add'>  <button bindtap='goSet'>添加圖書</button></view>

index.js

// pages/index/index.jsPage({  /**  * 頁面的初始數據  */ data: {   books:[]  },  /**  * 生命周期函數--監聽頁面加載  */ onLoad: function (options) {  const db = wx.cloud.database()  db.collection("books").get({   success:res=>{    this.setData({     books:res.data    })   },fail:err=>{    wx.showToast({     icon:"none",     title: '查詢記錄失敗',    })   }  }) },  goSet:function(){  wx.navigateTo({   url: '../set/set',  })  }, onDel:function(e){   let id = e.currentTarget.dataset.id   const db = wx.cloud.database();   db.collection("books").doc(id).remove({    success:res=>{     wx.showToast({      title: '刪除成功',     })     this.onLoad()//刪除成功重新加載    },fail:err=>{     wx.showToast({      title: '刪除失敗',     })    }   })   console.log(id) },onUpdate:function(e){   let id = e.currentTarget.dataset.id   wx.navigateTo({    url: '../set/set?id='+id,   }) }})

添加和修改共用set.wxml

<!--pages/set/set.wxml--><view class='container'>   <form bindsubmit='comfirm' >    <view class='input-container'>      <label>書名：</label>      <input style='display:none' data-value='{{id}}' name="id" value='{{book._id}}'></input>      <input data-value='{{name}}' name="name" value='{{book.name}}'></input>    </view>    <view class='input-container'>      <label>作者：</label>      <input data-value='{{author}}' name="author" value='{{book.author}}'></input>    </view>    <view class='input-container'>      <label>價格：</label>      <input data-value='{{price}}'  name ="price" value='{{book.price}}'></input>    </view>    <view class='comfirm'>      <button  form-type='submit'>保存</button>   </view>  </form></view>