微信小程序修改data使页面数据实时更新的代码示例
发布时间:2020-12-14 20:03:29 所属栏目:资源 来源:网络整理
导读:本篇文章给大家带来的内容是关于微信小程序修改data使页面数据实时更新的代码示例,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。 需求:通过点击button修改dataList中checkResult的值并修改按钮状态。 a.wxml: 编码:{{item.equipCode}}
本篇文章给大家带来的内容是关于微信小程序修改data使页面数据实时更新的代码示例,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。 需求:通过点击button修改dataList中checkResult的值并修改按钮状态。 a.wxml:
a.js Page({ data:{ dataList:[ {'equipCode':1001,'equipName':'打印机','checkItemName':'记录',checkResult:'正常'},{'equipCode':1002,checkResult:'异常'},{'equipCode':1003,{'equipCode':1004,{'equipCode':1005,checkResult:'正常'} ] },change: function(e) { var changeData = 'dataList['+e.target.dataset.index+'].checkResult'; if (e.target.dataset.status == '正常') { this.setData({ [changeData]: '正常'//修改状态,前端页面数据也会改变 }) } else { this.setData({ [changeData]: '异常' }) } },}) 上面示例通过this.setData修改data中的值,实现数据与前端页面保持一直,相当于vue中的双向数据绑定。 (编辑:李大同) 【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容! |