微信小程序 setData 对 data数据影响问题
我是纯前端的，有些时候没有后端接口，只能模拟一些数据来操作。偶然之下，发现了setdata 的一些机制，也有可能不对，请多指教。
先放结论：data的变量通过setdata绑在一起，是同步变化的
准备做一个一键还原界面的按钮事件，如果有后端接口，只需调一下接口，就可以了。问题是没有，于是想弄两个一模一样的数组A,B；A用来渲染界面，一键还原的时候，就把B的值赋给A，从而引起页面重新渲染，达到重置界面的效果。
结果一点反应也没有。
data里有模拟的数组 itemleft itemright，二选一，
定义代码是这么写的
this.setData({
uniqueitem: (id == 'unfinish') ? this.data.itemleft[index] : this.data.itemright[index],
cloneitem: (id == 'unfinish') ? this.data.itemleft[index] : this.data.itemright[index],
baninput: (id == 'unfinish')?false:true
})
这是一键还原的代码
this.setData({
uniqueitem:this.data.cloneitem
})
后来通过console.log发现 uniqueitem、cloneitem和this.data.itemleft[index] 的值是一模一样的，意思是，当我改变uniqueitem的时候，其他两个都会跟着变。
然后，我把cloneitem的值通过缓存还获取，代码变成了这样
this.setData({
uniqueitem: (id == 'unfinish') ? this.data.itemleft[index] : this.data.itemright[index],
baninput: (id == 'unfinish')?false:true
})
var that=this
wx.getStorage({
key: 'item',
success: function(res) {
console.log(res)
that.setData({
cloneitem:res.data
})
},
})
this.setData({
uniqueitem:this.data.cloneitem
})
改成这样之后，一键还原第一次正常，后面再点全不正常
这是测试的console顺序
console.log(this.data.itemleft[0]) console.log(this.data.uniqueitem) console.log(this.data.cloneitem)
事先说明，改变date，改的是2的date
我通过一个函数改变了date，加1，
可以看到 1和2同时改变，3不变；
一键还原第一次
可以看到，1不变，3的值赋给了2；到目前正常
再次改变date，
可以看到，2和3一起变，1不变了
一键还原
和上面一样不变了
后来我改成
var aaa = this.data.cloneitem;
this.setData({
uniqueitem:aaa
})
效果和上面一样。
结论，
当data有3个变量，a和b、c
this.setData({
a:this.data.b
c:this.data.b
})
意思是，a和b绑一起，c和b绑一起，3个一起变，改变一个等于改变3个。个人猜测，应该是存放变量a，b，c 的地址变成一个了。
this.setData({
a:this.data.b
})
a和b一起变。
this.setData({
a:this.data.c
})
a不和b一起变，和c一起变。
简而言之，data的变量通过setdata绑在一起，是同步变化的，要小心。
总结
以上所述是小编给大家介绍的微信小程序 setData 对 data数据影响问题，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言，小编会及时回复大家的！
相关文章
一个最简单的级联下拉菜单...2006-12-12
学习ajax必须得掌握的就是跨域请求,实际上在不同源的地址上发送请求就是跨域请求,本文主要给大家介绍了关于AJAX请求以及解决跨域问题的相关资料,需要的朋友可以参考下2022-11-11
这篇文章主要介绍了JS实现简单获取最近7天和最近3天日期的方法,涉及javascript针对日期与时间的相关数值运算与转换操作技巧,需要的朋友可以参考下2018-04-04
本文主要介绍了Echarts中X轴/Y轴坐标标签显示不下的问题解决,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧2023-09-09
本文主要介绍了分别使用javascript，jquery，css实现瀑布流布局的方法。具有很好的参考价值，下面跟着小编一起来看下吧2017-02-02
这篇文章主要为大家详细介绍了Bootstrap开发实战之响应式轮播图，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2016-06-06
这篇文章主要给大家介绍了关于微信小程序如何实现页面跳转功能的相关资料,包括页面跳转的方式、跳转传参的方法以及页面返回的操作,通过简单的代码示例,帮助读者快速掌握微信小程序页面跳转的基本用法,下面需要的朋友可以参考下2023-03-03
文章从什么是闭包、以及闭包所涉及的作用域链说起，讲述了JavaScript垃圾回收机制、循环引用、循环引用和闭包、IE中的内存泄漏以及解决方法，是篇非常详尽，非常不错的文章，这里推荐给大家。2014-11-11
这篇文章主要介绍了使用phantomjs进行网页抓取的实现代码,需要的朋友可以参考下2014-09-09
这篇文章主要介绍了JavaScript中的Primitive对象封装介绍,本文着重讲解封装过程,然后给出示例代码,需要的朋友可以参考下2014-12-12
最新评论