微信小程序中修改data中属性值

本文对比了微信小程序与Vue.js在数据更新机制上的不同。介绍了微信小程序中使用setData函数更新数据的方法,并探讨了在修改数组或对象单个属性时遇到的问题及解决方案。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

最近在学习微信小程序开发,由于前段时间学习了vue框架,所以学起来也不是很吃力。
vue框架和微信小程序非常相似,但是vue的经验却导致自己今天踩了一天的坑。


vue中设置属性值时只需要直接赋值就可以了,
类比之下,也在微信小程序中试了下,
别说,还真的行,打印输出都没有问题。
但是,接下来就掉坑了,页面并没有根据我更改的值进行刷新。
一开始,我以为是框架的机制的原因,上网查阅资料后才知道了setData函数。


setData函数,微信小程序内部的修改参数的函数,使用格式如下:

  data: {
    option:false
  },
  change:function(){
   this.setData({
     option:!this.data.option
   })
    console.log(this.data.option);
  },

但是这种方法在修改数组或者对象的单个属性时就暴露出问题:
除非将所有的属性都写上,否则会覆盖掉没有写的值。
这里写图片描述
那么换个思路只修改单个值,

array.name:wangyi,

或者是

array[name]:wanger

的形式是否可以呢?
答案是不行了,这样写编译器会报错。
不过我们可以换一种形式,将对象或者数组的属性转变为字符串就可以了。

change:function(){
   let temp = "array.name";
   this.setData({
     [temp]:'wangyi'
   })
    console.log(this.data.array);
  },
评论 5
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值