小程序模板网

微信小程序-修改数据后页面不渲染,设置全局变量,自定义属性 ...

发布时间:2018-04-14 14:30 所属栏目:小程序开发教程

一:修改数据后页面不渲染

分享者:向朔1992,原文地址

说明

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

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

数据修改不生效

今天继续要介绍一个setData()的问题。 
我们经常会这样写:

 

					
  1. var that = this;
  2. wx.getStorage({
  3. key: 'user',
  4. success: function(res){
  5. console.log(res.data)
  6. that.data.params.uuid = res.data.uuid;
  7. that.data.params.ticket = res.data.ticket;
  8. that.data.params.courseUuid = options.courseUuid;
  9. that.data.params.isCompany = options.isCompany;
  10.  
  11. that.fetchData();
  12. that.getShareList();
  13. }
  14. })

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

 

					
  1. var that = this;
  2. wx.getStorage({
  3. key: 'user',
  4. success: function(res){
  5. console.log(res.data)
  6. that.data.params.uuid = res.data.uuid;
  7. that.data.params.ticket = res.data.ticket;
  8. that.data.params.courseUuid = options.courseUuid;
  9. that.data.params.isCompany = options.isCompany;
  10.  
  11. that.setData({
  12. params: that.data.params
  13. })
  14.  
  15. that.fetchData();
  16. that.getShareList();
  17. }
  18. })

微信小程序的开发暂告一段落,后面条件满足了会上传审核的,如果有兴趣到时候可以搜索“华企商学院”来体验。

 

二:设置全局变量

为了提高程序的可用性我们在做项目的时候一定要设置全局变量

微信小程序里面有个app.js,我们可以在这个里面设置全局变量,

 

					
  1. globalData:{
  2. userInfo:null,
  3. username1:"woshihaiyong168"
  4. }

在其他.js中引用

 

					
  1. var testuname = getApp().globalData.username1;
  2. console.log(testuname)

这样就提高了代码的可用性!!!

 

三:自定义属性

微信小程序 自定义属性

 

					
  1. <view class='showList ' bindtop='shopPost' data-shopId='item.goods_id' ></view>

js 接值

 

					
  1. shopPost:function(event){ var postId = event.currentTarget.dataset.postid }
 
 
 


易优小程序(企业版)+灵活api+前后代码开源 码云仓库:starfork
本文地址:https://www.eyoucms.com/wxmini/doc/course/23371.html 复制链接 如需定制请联系易优客服咨询:800182392 点击咨询
QQ在线咨询