小程序之this.setData动态修改数据某个下标的值

1.基本使用

data:{
demo:1
}
比如上面这个data里面的demo,我们需要修改它的值。通常来说有两种方法:
1.直接this.data.demo 用 ‘=’来进行赋值,这是可行的,不过因为data里的数据一般都是跟页面进行绑定了的,我们直接‘=’赋值容易发生数据发生页面没有变化的情况发生。所以一般我们都是用第二种方法
2.this.setData({
demo:2
})
这种方法可以更新数据的时候同时更新渲染界面

2.动态修改

data: {
demo:2,
params: [{ cut: true }, { cut: true },{ cut: true }]
}
这次我们想要修改isDemo里面的特定下标的值,并且这个值是动态的,我们该怎么写:
直接假设一个wx:for循环的情况吧

 <view class='main-tow' wx:for='{{params}}' wx:for-index="bindex">
  <view class='main-head' data-bindex='{{bindex}}' bindtap='onHidden'>
    <text>{{item.cut}}</text>
  </view>
  </view>
复制代码

上面这个wxml里面,首先,我们通过wx:for-index进行key键的绑定,然后再需要绑定的view里面进行赋值data-bindex='{{bindex}}',这样我们就可以在js里面通过e.currentTarget.dataset.bindex,得到你渲染出来后选中点击view的下标。
这是你继续进行this.setData会得到一个报错Only number 0-9 could inside []:。 解决方法:
let index = e.currentTarget.dataset.bindex;
//根据点击不同的view获取对应的id值
let arr = this.data.params;
//重点在这里,组合出一个字符串
let arrCut = 'params[' + index + '].cut'
//用中括号把str括起来即可
this.setData({
[arrCut]: false
})

具体原理还不清楚,需要研究一下,这次就直接给出解决方法

转载于:https://juejin.im/post/5d021eba6fb9a07ee9586af2

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值