微信小程序> 微信小程序云开发数据库操作更新记录

微信小程序云开发数据库操作更新记录

浏览量:519 时间: 来源:祈澈菇凉

官方文档解读:

<!-- 更新记录 -->  <view class="guide" wx:if="{{step === 5}}">    <text class="headline">更新记录</text>    <text class="p">1. 打开 pages/databaseGuide/databaseGuide.js 文件,定位到 onCounterInc 和 onCounterDec 方法</text>    <text class="p">2. 把注释掉的代码解除注释</text>    <image class="code-image" src="../../images/code-db-inc-dec.png" mode="aspectFit"></image>    <text class="p">3. 点击下方按钮更新计数器</text>    <div class="counter">      <button class="minus" size="mini" type="default" bindtap="onCounterDec">-</button>      <text class="p">{{count}}</text>      <button class="plus" size="mini" type="default" bindtap="onCounterInc">+</button>    </div>    <div class="nav">      <button class="prev" size="mini" type="default" bindtap="prevStep">上一步</button>      <button class="next" size="mini" type="default" bindtap="nextStep">下一步</button>    </div>  </view>

wxml:

<div class="counter">      <button class="minus" size="mini" type="default" bindtap="onCounterDec">-</button>      <text class="p">{{count}}</text>      <button class="plus" size="mini" type="default" bindtap="onCounterInc">+</button></div>

js:

// pages/databaseGuide/databaseGuide.jsconst app = getApp()Page({  data: {    step: 1,    counterId: '',    openid: '',    count: null,    queryResult: '',  },  onLoad: function (options) {    if (app.globalData.openid) {      this.setData({        openid: app.globalData.openid      })    }  },  onCounterInc: function() {    const db = wx.cloud.database()    const newCount = this.data.count + 1    db.collection('counters').doc(this.data.counterId).update({      data: {        count: newCount      },      success: res => {        this.setData({          count: newCount        })      },      fail: err => {        icon: 'none',        console.error('[数据库] [更新记录] 失败:', err)      }    })  },  onCounterDec: function() {    const db = wx.cloud.database()    const newCount = this.data.count - 1    db.collection('counters').doc(this.data.counterId).update({      data: {        count: newCount      },      success: res => {        this.setData({          count: newCount        })      },      fail: err => {        icon: 'none',        console.error('[数据库] [更新记录] 失败:', err)      }    })  },})

效果如下:

http://recordit.co/NUyzs7XneE

小程序

原文作者:祈澈姑娘
技术博客:https://www.jianshu.com/u/05f416aefbe1
90后前端妹子,爱编程,爱运营,爱折腾。
坚持总结工作中遇到的技术问题,坚持记录工作中所所思所见,欢迎大家加入群聊,一起探讨交流。

微信小程序

版权声明

即速应用倡导尊重与保护知识产权。如发现本站文章存在版权问题,烦请提供版权疑问、身份证明、版权证明、联系方式等发邮件至197452366@qq.com ,我们将及时处理。本站文章仅作分享交流用途,作者观点不等同于即速应用观点。用户与作者的任何交易与本站无关,请知悉。

产品经理

手机 : 13312967497

擅长 : 小程序流量变现

扫码领取礼包

热门模板

  • 头条
  • 搜狐
  • 微博
  • 百家
  • 一点资讯
  • 知乎