微信小程序----修改data中的数据,页面数据不改变
2023-09-14 09:01:37 时间
WXRUI体验二维码
如果文章对你有帮助的话,请打开微信扫一下二维码,点击一下广告,支持一下作者!谢谢!
错误原因
由于VUE等框架,我们在逻辑层修改data中的数据后,视图层(页面渲染)会跟着发生变化。当然微信小程序也是实现了相同的功能,那么出现错误的原因是什么?答案:微信小程序的setData()方法。
常见赋值方式(习惯)导致的错误
Page({
data: {
isShow: false
},
changeStatus(){
console.log(this.data.isShow);
this.data.isShow = true;
console.log(this.data.isShow);
}
})
效果图
从上边代码和效果图我们可以看出:1、习惯的赋值方式“=”在逻辑层是起到了作用改变了isShow;2、视图层的并没有发生变化。
结论就是常规的“=”赋值方式,在微信小程序中只能改变data中的数据,而不能改变视图层的数据,那么微信小程序怎么解决这个问题的,setData()方法。
Page.prototype.setData()
setData 函数用于将数据从逻辑层发送到视图层(异步),同时改变对应的 this.data 的值(同步)。
setData函数做了哪些事情?
- 将数据从逻辑层发送到视图层----这个刚好解决我们这里出现的错误,视图层数据的改变
- 改变对应的 this.data 的值----同时在逻辑层将data中的值改变
Page({
data: {
isShow: false,
isShow1: false
},
changeStatus(){
console.log(this.data.isShow);
this.data.isShow = true;
console.log(this.data.isShow);
},
changeStatus1() {
console.log(this.data.isShow);
this.setData({ isShow:true});
console.log(this.data.isShow);
}
})
效果图
总结:
- 在开发程序的时候,我们要遵循别人的规则来开发,不要被习惯所左右;
- 熟悉开发文档,减少这种习惯错误(不易被发现);
- 微信小程序开发中,为了减少data和视图层数据表现不一致,全部采用setData方法修改值。
setData函数注意事项
- 直接修改 this.data 而不调用 this.setData 是无法改变页面的状态的,还会造成数据不一致。
- 单次设置的数据不能超过1024kB,请尽量避免一次设置过多的数据。
- 请不要把 data 中任何一项的 value 设为 undefined ,否则这一项将不被设置并可能遗留一些潜在问题。
WXRUI体验二维码
如果文章对你有帮助的话,请打开微信扫一下二维码,点击一下广告,支持一下作者!谢谢!
其他
相关文章
- 微信小程序服务器端登录注册验证「建议收藏」
- 【小程序】微信小程序设置globalData全局数据
- 基于腾讯云开发微信小程序(新闻发布及共享平台)上
- 微信小程序从注册appid到熟悉静态微信特有标签
- 基于微信小程序云开(统计学生信息并导出excel)4.0版(稳定版)
- 【说站】全球手机验证码发放+短视频去水印等组合微信小程序源码
- 【说站】多功能起名查重工具微信小程序源码
- 【说站】zblog微信小程序源码全开源完整版
- 【愚公系列】2022年09月 微信小程序-电商项目-商品列表也功能实现12(待写勿看)
- 微信小程序跳转页面携带参数
- 小程序bindtap传参_微信小程序bindtap
- 微信小程序 自定义 tabBar案例 官方案例迁入无效解决方法 非 tab 页显示 tabBar的问题解决 自定义tabBar与原生tabBar以及自写伪tabbar的区别
- 微信小程序 从后台接口接收数据并把数据传给要跳转的页面–小程序中页面传值数据不完整(mpvue)
- 【微信小程序】微信开发者工具调试PC端小程序报错wx.getUserProfile is not a function解决方案
- 开源即时通讯IM框架MobileIMSDK的微信小程序端开发快速入门
- ChatGPT如何接入到微信公众号支持国内服务器
- 微信小程序之弹框modal详解手机开发
- iOS版微信升级至8.0.8版 终于可以修改提示音甚至设置微信彩铃
- 微信小程序带来的Linux时代(微信小程序linux)
- 微信网友对话极视角CTO黄缨宁,畅谈计算机视觉与人工智能
- 微信小程序助力MSSQL数据便捷访问(微信小程序连接mssql)
- 微信时代,微信对接MSSQL对智能业务带来新动力(微信对接mssql)