小程序传过来多条,怎么只更新改变的数据,其他都不用重复更新

我就是想做一个50个数据记录一下自己每天数据,本想用update法更新的,可是提示错误,我又看不懂,

img


简单翻译一下 读写太多了吧,我也不时需要每次都改这么多,就是偶尔改一个两个数据,怎么能让动态的改变数据呢
下面是我的方法

img

img

img


一定要详细啊, 多谢

不用写那么多字段,看的头大。。如果要只修改值变化的,可以在data加个修改数据项,类型为对象,给number添加bindblur事件,对比原数据值不一样加入到修改项中,云数据库更新的时候用这个数据项就行

题主要的代码如下,有帮助麻烦点个采纳【本回答右上角】,谢谢~~有其他问题可以继续交流~
demo.wxml

img

<block wx:for="{{data}}" wx:key="index">
<input type="number" hidden="{{index=='_id'||index=='_openid'}}" value="{{data[index]}}" data-key="{{index}}" bindblur="checkValue" style="padding:3px;margin:5px;border:solid 1px #ccc"/>
</block>

<button type="primary" bindtap="saveToDB">保存</button>

demo.js

 wx.cloud.init({env: '题主云数据库环境值,注意更改这里'});///////////////////////
const db = wx.cloud.database();
 Page({
   data:{
     toBeUpdate:{}//更改的数据
  },
  onLoad(){
    var id='9e7190f16169492a002e81120cb524e1';//拿一条来做测试
     db.collection('test').doc(id).get({success:(res)=>{
       this.setData({data:res.data});
     }})
  },
  checkValue(e){
    var value=e.detail.value;//当前值
    var key=e.currentTarget.dataset.key;//获取input对应的key
    var data=this.data.data;//模拟的数据库值
    var toBeUpdate=this.data.toBeUpdate;//模拟的数据库值
    if(data[key]==value){//输入值一样,删除更新对象中的键名称
      delete toBeUpdate[key];
    }
    else toBeUpdate[key]=value;//加入到需要更新的对象中
    this.setData({toBeUpdate});
  },
  saveToDB(e){
    var toBeUpdate=this.data.toBeUpdate;
    console.log(toBeUpdate);
    var keys=Object.keys(toBeUpdate);//从更新对象中获取更新的key,判断是否有更新的列
    if(keys.length==0)wx.showToast({title: '没有修改的数据',icon:'none'});
    else{
      db.collection('test').doc(this.data.data._id).update({
        data:toBeUpdate,
        success: (e)=>{
          wx.showToast({title: '数据更新成功'});
          //注意要更新data和清空缓存
          for(var attr in toBeUpdate){this.data.data[attr]=toBeUpdate[attr];}    
          this.setData({data:this.data.data,toBeUpdate:{}})
        },
        fail:()=>{wx.showToast({title: '数据更新失败',icon:'none'});}
      })
    }
  }
  })
   

把接收到的数据绑定到数组变量即可

  1. 微信小程序全局响应式状态管理器解决方案 https://gitee.com/Rattenking/Tina
    ,这个管理器实现了setData只更新当前更新的部分,原来已经渲染的,没有改变的,不进行更新渲染!
  2. 如果是成熟的项目,不建议采用第一种方法,可以将他的setData的实现提出来,单独作为一个插件加入到项目!
  3. setData不更新原来,只更新当前新加载的原理其实很简单
    微信小程序---- setData 列表性能优化 原始方法----将现有列表和新加载列表拼接 setData方法1:利用数组 push 方法var list = this.data.orderList;res.list.forEach(cur => list.push(cur));this.setData({ orderList: list})方法2:利用数组 concat 方法var list = this.data.orderList;this.setData({ orderList: list.concat(res.l https://blog.csdn.net/m0_38082783/article/details/110129220
    ,最后一种方法,自己就可以实现!