小程序setData()使用和注意事项
注意:
- 直接修改this.data,而不调用this.setData(),是无法改变当前页面的状态的,会导致数据不一致
- 仅支持可以JSON化的数据
- 单次设置的数据不能超过1024KB,尽量避免一次设置过多的数据
- 不要把data中的任何一项的value设为undefined,否则这一项将不能被设置,可能会有潜在的问题
代码示例:
Page({
/**
* 页面的初始数据
*/
data: {
value:"初始值" //定义一个变量value,赋值为:“初始化”
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
}
})
直接在wx:request()的success回调函数中使用this.setData()会报这样一个错误:

解决:因为这里的wx:rewuest()是在页面加载时调用,所以我们可以在onLoad()中定义一个变量that ,将this赋值给that,那么此时的that代表相对于onLoad()的当前对象,然后在success回调函数中直接使用that.setData()即可。
这是设置Page data的示例:
Page({
/**
* 页面的初始数据
*/
data: {
score_list: null,
guanka_list: null,
currentTab: 0
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
var that = this //定义一个全局变量that
wx.request({
url: app.globalData.baseUrl + "query/rankByScore",
type: 'GET',
dataType: 'json',
success: function (res) {
that.setData({
score_list: res.data.data
})
console.log(1, res)
}
})
}
})
小程序setData()使用和注意事项的更多相关文章
- 小程序setData方法使用总结
做了一下小程序setData使用方法总结,如有错误,请不吝指出,Thanks♪(・ω・)ノ //示例data: data:{ user:'young', obj:{ name:'蓝色蒲公英', ag ...
- 微信小程序 setData 的坑(转)
最近在使用微信小程序的setData时,遇到了以下问题.如下: 官网文档在使用setData()设置数组对象的某个元素的属性时,是这么使用的: Page({ data: { array: [{text ...
- 小程序setData工作原理理解图
优化建议:1.频繁的去setData--我曾经用这个弄过动画效果,当然后来发现JS动画不适合小程序,CSS3动画才是王道2.每次setData都传递大量新数据--这个大量还真不好理解,暂时定为排行榜类 ...
- 微信小程序setData子元素
页面的数据中如果有子元素,如下图nowQuestion中的deleted元素 在小程序的setData中,不能直接用nowQuestion.deleted来设定它的值,而需要再定义一个变量承接 另外, ...
- 微信小程序setData的使用,通过[...]进行动态key赋值
首先先介绍一下微信小程序Page.prototype.setData(Object data, Function callback)的讲解: setData函数用于将数据从逻辑层发送到视图层(异步), ...
- 微信小程序 setData动态修改数据数组的值
1.问题说明 有一组数据,用来存储图片路径,动态修改图片的路径来上传图片,而小程序JS只能通过事件获取时机和setData方法修改数据来改变view. 而用这样写的方式明显是错误的 2.解决办法 字符 ...
- 微信小程序setData复杂数组的更新、删除、添加、拼接
众所周知,微信小程序里所有对数据的修改只有在setData里修改才会在页面上渲染.在此分享小程序里复杂数组的更新.删除.添加.拼接 初始数据 数组嵌套对象 data: { cartList = [{ ...
- 微信小程序 setData 如何修改动态数据?
最近这段时间在写微信小程序,有一个页面需要动态修改 data 中的数据,而这里似乎是个坑. 1.正常修改 正常修改很简单,当触发 change 事件时,数据和页面都会同时发生改变.这个也不用多说,很简 ...
- 小程序setData数据量过大时候会对渲染有影响吗?
datas:[ { id:1000, name: "帅哥", title: '...', b: '...', d: 0, f:0, .... }, { id:1001, name: ...
随机推荐
- Deepin 15.9系统直接运行exe运行程序
以下为你介绍在深度Deepin 15.9 Linux操作系统下直接运行exe文件的方法,此方法基于deepin-wine实现,经测试,一些exe文件是可以正常打开的,但部分可能会出现无法使用的情况,但 ...
- AcWing 29. 删除链表中重复的节点
题目地址 https://www.acwing.com/problem/content/description/27/ 来源:剑指Offer 题目描述在一个排序的链表中,存在重复的结点,请删除该链表中 ...
- python爬虫之爬取网站到数据库
一.根据已有程序运行得到的结果 完整代码如下: import sqlite3; class DB(object): """数据库访问方法的实现""&q ...
- 洛谷 P5638 光骓者的荣耀
洛谷 P5638 [CSGRound2]光骓者的荣耀 洛谷传送门 题目背景 小 K 又在做白日梦了.他进入到他的幻想中,发现他打下了一片江山. 题目描述 小 K 打下的江山一共有nn个城市,城市ii和 ...
- Linux运维基础篇大全
基础知识的文章都在这里https://www.jianshu.com/u/a3c215af055a ,想要了解,请访问这个地址!!!!
- navicat连接mysql报错1251解决方案,从头搭建node + mysql 8.0 (本人亲测有效)
准备学node 好久了 一直没有动手去写,今天突发奇想,然后就安装了一个mysql (找了一个博客跟着步骤去安装的),然后打算用node 写个增删改查. 1.下载mysql安装包 地址: http ...
- 干货 | 国内互联网公司是如何做微服务实践的?(附PPT下载)
微服务的概念最早由Martin Fowler与James Lewis于2014年共同提出,并随着Netflix最佳实践的发布而为业界所知.如今,在国内有了大量的微服务实践案例,5月18日,网易云联合云 ...
- springboot深入浅出系列(16章97节)-看了都说好
章节目录 第一章 spring boot 2.x基础及概念入门 1.1.spring boot 产生的背景及其优势 1.2.spring boot 2.x 新特性说明 1.3.helloworld及项 ...
- log4net快速上手
原文地址:https://www.cnblogs.com/lsgsanxiao/p/5845300.html 略有删改 1.配置文件,可以单独创建log4net.config文件,然后手动指定目录,也 ...
- C# redis StackExchange
1.Install-Package StackExchange -v 2.0.601 2.using StackExchange.Redis; 3. static void StackExchange ...