【微信小程序开发】 动态修改数组&wxs

给小程序添加新的功能遇到一个问题，需要点击CheckBox来修改某个数组里某一项的值。

因为我自己平时有时候会手机备忘录记一点，电脑便签记一点，所以打算给我的小程序【口袋趣屋】添加一个类似于todo的功能。。

动态修改数组

大概类似这样的一个列表

右边是一个switch， checkbox类型。

点击勾选之后，首先更新数据库，然后更新页面的data。

数据的结构是这样的：

done为true 的时候就是选中，done 为false的时候表示没有完成。

      db.collection('user_todo_record').doc(id).update({
        data: {
          done: false
        },
        success: function (res) {
          console.log(res)
          let temp = 'content[' + index + '].done'   // 利用这个来表示，就能实现更改数组里的某一项的数据了
          that.setData({
            [temp]: false,
	  // 直接在这个位置写content[index].done 的话，会提示错误，不能识别
          })
        }
      })

wxs

参考： 官方文档

利用wx:for 渲染数组的时候，我想根据数组里的元素的id是否在另一个数组里来判断单选框是否处于选中状态。

小程序页面的语法是不支持直接indexOf的，所以需要使用wxs。

WXS（WeiXin Script）是小程序的一套脚本语言，结合 WXML，可以构建出页面的结构。WXS 与 JavaScript 是不同的语言，有自己的语法，并不和 JavaScript 一致。

// array.wxs

function defineIndexOf(str, val) {
  return str.indexOf(val);
}
module.exports = {
  indexOf: defineIndexOf
}

<wxs src="array.wxs" module="arrayTool" />

<switch type="checkbox" value="{{item._id}}" checked="{{arrayTool.indexOf(today_info, item._id) > -1?true:''}}" bindchange="todoCom" data-id="{{item._id}}"/>

我的个人博客链接