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


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 幻灯片的实现
Dec 06 Javascript
node.js中的fs.ftruncate方法使用说明
Dec 15 Javascript
JS仿iGoogle自定义首页模块拖拽特效的方法
Feb 13 Javascript
jQuery弹簧插件编写基础之“又见弹窗”
Dec 11 Javascript
js实现对ajax请求面向对象的封装
Jan 08 Javascript
AngularJS的ng-click传参的方法
Jun 19 Javascript
AngularJS实现的省市二级联动功能示例【可对选项实现增删】
Oct 26 Javascript
在Vue组件中使用 TypeScript的方法
Feb 28 Javascript
判断iOS、Android以及PC端的示例代码
Nov 15 Javascript
如何基于vue-cli3.0构建功能完善的移动端架子
Apr 24 Javascript
react 中父组件与子组件双向绑定问题
May 20 Javascript
解决vue动态下拉菜单 有数据未反应的问题
Aug 06 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 in_array 函数使用说明与in_array需要注意的地方说明
2010/04/13 PHP
phpmailer发送gmail邮件实例详解
2013/06/24 PHP
PHP图像识别技术原理与实现
2016/10/27 PHP
详解PHP序列化和反序列化原理
2018/01/15 PHP
jquery 学习之二 属性相关
2010/11/23 Javascript
jQuery操作Select选择的Text和Value(获取/设置/添加/删除)
2013/03/06 Javascript
jquery设置text的值示例(设置文本框 DIV 表单值)
2014/01/06 Javascript
一个简单的jQuery计算器实现了连续计算功能
2014/07/21 Javascript
Js使用WScript.Shell对象执行.bat文件和cmd命令
2014/12/18 Javascript
Angularjs制作简单的路由功能demo
2015/04/14 Javascript
jQuery判断指定id的对象是否存在的方法
2015/05/22 Javascript
使用jspdf生成pdf报表
2015/07/03 Javascript
jquery实现图片预加载
2015/12/25 Javascript
浅谈JS原型对象和原型链
2016/03/02 Javascript
利用jsonp跨域调用百度js实现搜索框智能提示
2016/08/24 Javascript
jQuery Ajax传值到Servlet出现乱码问题的解决方法
2016/10/09 Javascript
JS获得多个同name 的input输入框的值的实现方法
2017/01/09 Javascript
说说如何在Vue.js中实现数字输入组件的方法
2019/01/08 Javascript
JS实现吸顶特效
2020/01/08 Javascript
在Python的循环体中使用else语句的方法
2015/03/30 Python
Python 12306抢火车票脚本 Python京东抢手机脚本
2018/02/06 Python
查找python项目依赖并生成requirements.txt的方法
2018/07/10 Python
Python文件打开方式实例详解【a、a+、r+、w+区别】
2019/03/30 Python
matplotlib绘制多个子图(subplot)的方法
2019/12/03 Python
Django操作session 的方法
2020/03/09 Python
使用python创建Excel工作簿及工作表过程图解
2020/05/27 Python
python redis存入字典序列化存储教程
2020/07/16 Python
Python json格式化打印实现过程解析
2020/07/21 Python
python调用私有属性的方法总结
2020/07/24 Python
体验完美剃须:The Art of Shaving
2018/08/06 全球购物
秋季运动会稿件
2014/01/30 职场文书
奥巴马的演讲稿
2014/05/15 职场文书
学校地质灾害防治方案
2014/06/10 职场文书
我的1919观后感
2015/06/03 职场文书
SQL实现LeetCode(197.上升温度)
2021/08/07 MySQL
React四级菜单的实现
2022/04/08 Javascript