微信小程序遇到修改数据后页面不渲染的问题解决


Posted in Javascript onMarch 09, 2017

微信小程序遇到修改数据后页面不渲染的问题解决

前言:

去年从小程序一开始出来到现在,我一直是比较看好和保持一定的关注度的,小程序的掀起的波浪我觉得一开始是在前端及其他技术开发人群中的,这是我第一次有意识的亲眼目睹了一个新技术的发展,还是感觉比较荣幸的。
唱衰小程序?我的观点是肯定不可能,因为现在每天提交审核的小程序还在继续增加,而且有些小程序确实很好用,比如摩拜的扫码骑车,还有我上周去KTV,直接用小程序扫屏幕上的二维码,就可以绑定房间,然后通过小程序点歌,切歌,发表情包等方便好玩的事情,所以,在我看来,有些应用场景是非常适合小程序的,以后生活中的更多场景会更多的应用小程序。

截止到目前,小程序的系列文章写了有十几篇,基本上是解决开发中的一些问题,踩过的坑。我的小程序也已经写的差不多了,但是公司的https加密认证还没有弄好,所以只能暂且搁置在那里了。

数据修改不生效

今天继续要介绍一个setData()的问题。

我们经常会这样写:

var that = this;
wx.getStorage({
  key: 'user',
  success: function(res){
    console.log(res.data)
    that.data.params.uuid = res.data.uuid;
    that.data.params.ticket = res.data.ticket;
    that.data.params.courseUuid = options.courseUuid;
    that.data.params.isCompany = options.isCompany;

    that.fetchData();
    that.getShareList();
  }
})

我们给data对象进行了一些赋值操作,但是发现接着使用这些数据的时候是不对的,我们赋值的数据并没有成功的渲染到页面。找了好久之后我发现,原来要想数据立马生效,必须要调用一下setData()方法才能有用,所以上面的代码修改如下:

var that = this;
wx.getStorage({
  key: 'user',
  success: function(res){
    console.log(res.data)
    that.data.params.uuid = res.data.uuid;
    that.data.params.ticket = res.data.ticket;
    that.data.params.courseUuid = options.courseUuid;
    that.data.params.isCompany = options.isCompany;

    that.setData({
      params: that.data.params
    })

    that.fetchData();
    that.getShareList();
  }
})

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
JS运行耗时操作的延时显示方法
Nov 19 Javascript
js中设置元素class的三种方法小结
Aug 28 Javascript
href下载文件根据id取url并下载
May 28 Javascript
浅谈使用MVC模式进行JavaScript程序开发
Nov 10 Javascript
浅谈JS中的三种字符串连接方式及其性能比较
Sep 02 Javascript
node.js版本管理工具n无效的原理和解决方法
Nov 24 Javascript
jquery 判断div show的状态实例
Dec 03 Javascript
bootstrap提示标签、提示框实现代码
Dec 28 Javascript
分享一个精简的vue.js 图片lazyload插件实例
Mar 13 Javascript
浅谈JS 数字和字符串之间相互转化的纠纷
Oct 20 Javascript
微信小程序点击列表跳转到对应详情页过程解析
Sep 26 Javascript
js canvas实现俄罗斯方块
Oct 11 Javascript
js实现时间轴自动排列效果
Mar 09 #Javascript
jQuery插件HighCharts绘制2D柱状图、折线图和饼图的组合图效果示例【附demo源码下载】
Mar 09 #Javascript
100行代码理解和分析vue2.0响应式架构
Mar 09 #Javascript
js实现悬浮窗效果(支持拖动)
Mar 09 #Javascript
详解vuelidate 对于vueJs2.0的验证解决方案
Mar 09 #Javascript
Bootstrap禁用响应式布局的实现方法
Mar 09 #Javascript
微信小程序 template模板详解及实例代码
Mar 09 #Javascript
You might like
php循环创建目录示例分享(php创建多级目录)
2014/03/04 PHP
PHP字符串比较函数strcmp()和strcasecmp()使用总结
2014/11/19 PHP
php简单socket服务器客户端代码实例
2015/05/18 PHP
求帮忙修改个php curl模拟post请求内容后并下载文件的解决思路
2015/09/20 PHP
使用php从身份证号中获取一系列线索(星座、生肖、生日等)
2016/05/11 PHP
PHP实现十进制数字与二十六进制字母串相互转换操作示例
2018/08/10 PHP
php微信公众号开发之图片回复
2018/10/20 PHP
PHP利用递归函数实现无限级分类的方法
2019/03/22 PHP
PHP连接MySQL数据库三种实现方法
2020/12/10 PHP
检测jQuery.js是否已加载的判断代码
2011/05/20 Javascript
读jQuery之九 一些瑕疵说明
2011/06/21 Javascript
js禁止页面使用右键(简单示例代码)
2013/11/13 Javascript
JQuery文字列表向上滚动的代码
2013/11/13 Javascript
javascript实现博客园页面右下角返回顶部按钮
2015/02/22 Javascript
JavaScript中利用Array和Object实现Map的方法
2015/07/27 Javascript
快速使用node.js进行web开发详解
2017/04/26 Javascript
jQuery实现上传图片前预览效果功能
2017/08/03 jQuery
layui 设置table 行的高度方法
2018/08/17 Javascript
Vue源码探究之状态初始化
2018/11/14 Javascript
vue动态添加路由addRoutes之不能将动态路由存入缓存的解决
2019/02/19 Javascript
ES6 Set结构的应用实例分析
2019/06/26 Javascript
es6 super关键字的理解与应用实例分析
2020/02/15 Javascript
[03:06]2018年度CS GO最具人气解说-完美盛典
2018/12/16 DOTA
Python远程桌面协议RDPY安装使用介绍
2015/04/15 Python
介绍Python的@property装饰器的用法
2015/04/28 Python
微信跳一跳自动运行python脚本
2018/01/08 Python
python调用OpenCV实现人脸识别功能
2018/05/25 Python
TensorFLow 不同大小图片的TFrecords存取实例
2020/01/20 Python
Python使用shutil模块实现文件拷贝
2020/07/31 Python
澳大利亚最好的在线时尚精品店:Princess Polly
2018/01/03 全球购物
英国健身仓库:Bodybuilding Warehouse
2019/03/06 全球购物
医学生自荐信范文
2013/12/03 职场文书
材料加工工程求职信
2014/02/19 职场文书
村干部培训方案
2014/05/02 职场文书
关于美容院的活动方案
2014/08/14 职场文书
2014年仓管员工作总结
2014/11/18 职场文书