微信小程序开发之改变data中数组或对象的某一属性值

前端之家收集整理的这篇文章主要介绍了微信小程序开发之改变data中数组或对象的某一属性值前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。

前言:在小程序的开发中,我们在view中便利data中数组或对象时,很多情况下需要在js中动态改变数组或者对象中某一香的属性值。

效果图:

我给大家总结了案例如下:

wxml如下:

{{item.week}} {{item.date}}  

wxss如下:

Box-sizing: border-Box; } .date-cont { width: 40rpx; margin-right: 70rpx; height: 100%; display: inline-block; padding-top: 10rpx; Box-sizing: border-Box; text-align: center; } .curl { width: 40rpx; height: 40rpx; border-radius: 50%; line-height: 40rpx; } .date-cont view:first-child { margin-bottom: 20rpx; } .focus { display: inline-block; width: 40rpx; height: 40rpx; font-family: Monaco;">#fff; color: #16cc80; border-radius: 50%; line-height: 40rpx; }

wxjs如下:

实现思路:点击某一个日期时,获取当前点击的下表,点击事件bindtap可以获取到所点击的元素的自定义属性,也就是所点击的元素的在data中数组的下标,点击触发,清空所有对象中selected的值,然后将所点击的下标的selected值变为focus就可实现点击某一元素动态改变数组中的某一属性值。

{ var sItem = "sDate["+ index + "].selected"; this.setData({ [sItem]: " " }) console.log([sItem]); if(index == oIndex) { var oSelected = "sDate[" + index + "].selected"//这里需要将设置的属性用字符串进行拼接 this.setData({ [oSelected]: "focus" }) } }) },})

总结

以上所述是小编给大家介绍的微信小程序开发之改变data中数组或对象的某一属性值。编程之家 jb51.cc 收集整理的教程希望能对你有所帮助,如果觉得编程之家不错,可分享给好友!感谢支持

猜你在找的微信小程序相关文章