1000字范文,内容丰富有趣,学习的好帮手!
1000字范文 > 微信小程序中使用wx:for 循环中绑定点击事件 对数组进行渲染

微信小程序中使用wx:for 循环中绑定点击事件 对数组进行渲染

时间:2024-04-16 09:43:49

相关推荐

微信小程序中使用wx:for 循环中绑定点击事件 对数组进行渲染

微信小程序实际开发中,在for循环中,需要获取用户对那组数据进行了修改,使用了vue太久,微信小程序有点忘记了,查阅资料后也是很快熟悉起来,但是赋值过程中遇到了一些小问题,解决了,特此记录一下。

1、在for循环中使用switch开关,用户点击对应开关,需要将对应数组中checked改变状态

<switch style="zoom:.8;margin:30rpx 0 0 20rpx;" type="switch" checked="{{item.checked}}" bindchange="listenerSwitch" data-index='{{index}}' />

使用‘data-’ 可以绑定对应用户点击的for循环中数组的下标,此处用data-index=’{{index}}'进行绑定。

listenerSwitch(event){var b = event.currentTarget.dataset.indexthis.setData({[`list_zidonghua[${b}].checked`]:!this.data.list_zidonghua[b].checked})console.log(this.data.list_zidonghua);},

此处event.currentTarget.dataset.index便是获取到wxml中所处理的数组下标,一开始直接赋值

this.setData({'list_zidonghua[${b}].checked':!this.data.list_zidonghua[b].checked})

会报下面的错误

Error: Only digits (0-9) can be put inside [] in the path string

查阅官方文档后修改为上述赋值,轻松解决。

官方文档:

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。