微信小程序：动态修改数组的某一个元素

简介

在微信小程序项目中，需要点击页面遍历出的某一个元素，更换其图标。经过踩坑，发现了关键点，与大家分享一下。

具体实现

// 定义的数组
data: {
     
  arrayData: [
    {
      keyID: "1", name: "大娃", sex: 1, birth: "2019-10-10", info: {
      like: "苹果", goodAt: "LOL" } },
    {
      keyID: "2", name: "二娃", sex: 0, birth: "2019-10-10", info: {
      like: "香蕉", goodAt: "DNF" } },
    {
      keyID: "3", name: "三娃", sex: 1, birth: "2019-10-10", info: {
      like: "樱桃", goodAt: "CF" } }
  ]
}

一般情况下，我们会这样写：

// 需要在遍历出的对象处添加 bindtap 事件，并 data-index 绑定 index ( wx:for 自带就有的 index，不用特别声明)
clickedFun:function(e) {
     
  let that = this;
  let indexs = e.currentTarget.dataset.index;
  that.setData({
     
    arrayData[indexs].info.goodAt: "跑步"
  });
}

发现这样并不能达到想要的效果！！！
小程序中正确的写法如下：

// 需要在遍历出的对象处添加 bindtap 事件，并 data-index 绑定 index ( wx:for 自带就有的 index，不用特别声明)
clickedFun:function(e) {
     
  let that = this;
  let indexs = e.currentTarget.dataset.index;
  that.setData({
     
    ["arrayData[" + indexs + "].info.goodAt: "跑步"]
  });
}

至于setData的具体规则，就请大家去查看小程序官方文档介绍了。

最后

觉得有用的朋友请用你的金手指点一下赞，或者评论留言一起探讨技术！