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


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 相关文章推荐
jquery获取table中的某行全部td的内容方法
Mar 08 Javascript
js借助ActiveXObject实现创建文件
Sep 29 Javascript
jquery 字符串切割函数substring的用法说明
Feb 11 Javascript
jquery 隐藏与显示tr标签示例代码
Jun 06 Javascript
基于Css3和JQuery实现打字机效果
Aug 11 Javascript
详解JavaScript正则表达式之分组匹配及反向引用
Mar 09 Javascript
js数组与字符串常用方法总结
Jan 13 Javascript
判断jQuery是否加载完成,没完成继续判断的解决方法
Dec 06 jQuery
vue 中swiper的使用教程
May 22 Javascript
微信小程序的开发范式BeautyWe.js入门详解
Jul 10 Javascript
layui 弹出层值回传解决方式
Nov 14 Javascript
js实现图片实时时钟
Jan 15 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引用(&)各种使用方法实例详解
2014/03/20 PHP
详解PHP执行定时任务的实现思路
2015/12/21 PHP
浅谈Coreseek、Sphinx-for-chinaese、Sphinx+Scws的区别
2016/12/15 PHP
Laravel 5.4前后台分离,通过不同的二级域名访问方法
2019/10/13 PHP
如何实现iframe(嵌入式帧)的自适应高度
2006/07/26 Javascript
WordPress 照片lightbox效果的运用几点
2009/06/22 Javascript
jQuery中:file选择器用法实例
2015/01/04 Javascript
jQuery使用hide方法隐藏指定元素class样式用法实例
2015/03/30 Javascript
Jquery和JS获取ul中li标签的实现方法
2016/06/02 Javascript
JS中判断字符串中出现次数最多的字符及出现的次数的简单实例
2016/06/03 Javascript
浅谈jquery之on()绑定事件和off()解除绑定事件
2016/10/26 Javascript
vue-baidu-map 进入页面自动定位的解决方案(推荐)
2018/04/28 Javascript
详解ajax的data参数错误导致页面崩溃
2018/04/30 Javascript
vue.js实现的经典计算器/科学计算器功能示例
2018/07/11 Javascript
jQuery+ajax实现批量删除功能完整示例
2019/06/06 jQuery
JavaScript变量作用域及内存问题实例分析
2019/06/10 Javascript
微信小程序3种位置API的使用方法详解
2019/08/05 Javascript
Python 错误和异常小结
2013/10/09 Python
python判断windows系统是32位还是64位的方法
2015/05/11 Python
谈谈如何手动释放Python的内存
2016/12/17 Python
python用户管理系统的实例讲解
2017/12/23 Python
python学习--使用QQ邮箱发送邮件代码实例
2019/04/16 Python
Django xadmin开启搜索功能的实现
2019/11/15 Python
QML实现钟表效果
2020/06/02 Python
pandas参数设置的实用小技巧
2020/08/23 Python
Python脚本调试工具安装过程
2021/01/11 Python
全网最细 Python 格式化输出用法讲解(推荐)
2021/01/18 Python
深入理解HTML5定时器requestAnimationFrame的使用
2018/12/12 HTML / CSS
Molton Brown美国官网:奢华美容、香水、沐浴和身体护理
2020/09/02 全球购物
戴尔新加坡官网:Dell Singapore
2020/12/13 全球购物
党员个人思想汇报
2013/12/28 职场文书
爱国卫生月实施方案
2014/02/21 职场文书
高一课前三分钟演讲稿
2014/09/13 职场文书
go xorm框架的使用
2021/05/22 Golang
oracle连接ODBC sqlserver数据源的详细步骤
2021/07/25 Oracle
Python加密技术之RSA加密解密的实现
2022/04/08 Python