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


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 相关文章推荐
Google Suggest ;-) 基于js的动态下拉菜单
Oct 11 Javascript
Firefox中beforeunload事件的实现缺陷浅析
May 03 Javascript
Extjs中的GridPanel隐藏列会显示在menuDisabled中解决方法
Jan 27 Javascript
javascript 获取HTML DOM父、子、临近节点
Jun 16 Javascript
基于JS如何实现类似QQ好友头像hover时显示资料卡的效果(推荐)
Jun 09 Javascript
Javascript 制作图形验证码实例详解
Dec 22 Javascript
老生常谈的跨域处理
Jan 11 Javascript
AngularJS自定义指令之复制指令实现方法
May 18 Javascript
jquery.guide.js新版上线操作向导镂空提示jQuery插件(推荐)
May 20 jQuery
js 两数组去除重复数值的实例
Dec 06 Javascript
Angular项目从新建、打包到nginx部署全过程记录
Dec 09 Javascript
微信小程序实现底部弹出模态框
Nov 18 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
火影忍者:三大瞳力之一的白眼,为什么没有写轮眼那么出色?
2020/03/02 日漫
PHPlet在Windows下的安装
2006/10/09 PHP
详解js异步文件加载器
2016/01/24 PHP
微信利用PHP创建自定义菜单的方法
2016/08/01 PHP
PHP面向对象程序设计之命名空间与自动加载类详解
2016/12/02 PHP
php使用curl下载指定大小的文件实例代码
2017/09/30 PHP
window.name代替cookie的实现代码
2010/11/28 Javascript
多次注册事件会导致一个事件被触发多次的解决方法
2013/08/12 Javascript
javascript插件开发的一些感想和心得
2016/02/28 Javascript
jquery实现右侧栏菜单选择操作
2016/03/04 Javascript
easyui combobox开启搜索自动完成功能的实例代码
2016/11/08 Javascript
JavaScript两个变量交换值的实现方法
2017/03/01 Javascript
vue组件Prop传递数据的实现示例
2017/08/17 Javascript
Angular使用Md5加密的解决方法
2017/09/16 Javascript
vue中实现左右联动的效果
2018/06/22 Javascript
layui table 参数设置方法
2018/08/14 Javascript
clipboard在vue中的使用的方法示例
2018/10/19 Javascript
详解Vue.js v-for不支持IE9的解决方法
2018/12/29 Javascript
Python中协程用法代码详解
2018/02/10 Python
[原创]Python入门教程1. 基本运算【四则运算、变量、math模块等】
2018/10/28 Python
Python3 Post登录并且保存cookie登录其他页面的方法
2018/12/28 Python
django框架实现一次性上传多个文件功能示例【批量上传】
2019/06/19 Python
浅谈pyqt5在QMainWindow中布局的问题
2019/06/21 Python
Pandas之ReIndex重新索引的实现
2019/06/25 Python
pycharm中leetcode插件使用图文详解
2020/12/07 Python
html5模拟平抛运动(模拟小球平抛运动过程)
2013/07/25 HTML / CSS
越南综合购物网站:Lazada越南
2019/06/10 全球购物
德国排名第一的主题公园门票网站:Attraction Tickets Direct
2019/09/09 全球购物
美国在线艺术商店:HandmadePiece
2020/11/06 全球购物
Smilodox官方运动服装店:从运动服到健身配件
2020/08/27 全球购物
公司同意接收函
2014/01/13 职场文书
我的中国梦演讲稿初中篇
2014/08/19 职场文书
公司新人试用期自我评价
2014/09/17 职场文书
《倍数和因数》教学反思
2016/02/23 职场文书
MySQL Router的安装部署
2021/04/24 MySQL
Python必备技巧之函数的使用详解
2022/04/04 Python