微信小程序-setData()方法
一般setData方法多用于点击后改变页面信息或者刷新后与后台交互获取最新的信息
注意:
- 直接修改 this.data 而不调用 this.setData 是无法改变页面的状态的,还会造成数据不一致
- 单次设置的数据不能超过1024kB,请尽量避免一次设置过多的数据。
方法如下:
js:
Page({
data: {
text: 'init data',
num: ,
array: [{text: 'init data'}],
object: {
text: 'init data'
}
},
changeText: function() {
// this.data.text = 'changed data' // bad, it can not work
this.setData({
text: 'changed data'
})
},
changeNum: function() {
this.data.num =
this.setData({
num: this.data.num
})
},
changeItemInArray: function() {
// you can use this way to modify a danamic data path
this.setData({
'array[0].text':'changed data'
})
},
changeItemInObject: function(){
this.setData({
'object.text': 'changed data'
});
},
addNewField: function() {
this.setData({
'newField.text': 'new data'
})
}
})
wxml:
<view>{{text}}</view>
<button bindtap="changeText"> Change normal data </button>
<view>{{num}}</view>
<button bindtap="changeNum"> Change normal num </button>
<view>{{array[0].text}}</view>
<button bindtap="changeItemInArray"> Change Array data </button>
<view>{{object.text}}</view>
<button bindtap="changeItemInObject"> Change Object data </button>
<view>{{newField.text}}</view>
<button bindtap="addNewField"> Add new data </button>
微信小程序-setData()方法的更多相关文章
- 微信小程序setData()方法的详解以及对数组/json操作
此篇文章是本人对setData方法的一些理解,是查阅文档和查找一些其他资料综述的,有所不足希望指正! 直接进入正题! 一.setData()方法: 1.参数接受一个对象,以key,value的形式表示 ...
- 微信小程序 setData 的坑(转)
最近在使用微信小程序的setData时,遇到了以下问题.如下: 官网文档在使用setData()设置数组对象的某个元素的属性时,是这么使用的: Page({ data: { array: [{text ...
- 微信小程序setData复杂数组的更新、删除、添加、拼接
众所周知,微信小程序里所有对数据的修改只有在setData里修改才会在页面上渲染.在此分享小程序里复杂数组的更新.删除.添加.拼接 初始数据 数组嵌套对象 data: { cartList = [{ ...
- 微信小程序setData的使用,通过[...]进行动态key赋值
首先先介绍一下微信小程序Page.prototype.setData(Object data, Function callback)的讲解: setData函数用于将数据从逻辑层发送到视图层(异步), ...
- 微信小程序 setData 如何修改动态数据?
最近这段时间在写微信小程序,有一个页面需要动态修改 data 中的数据,而这里似乎是个坑. 1.正常修改 正常修改很简单,当触发 change 事件时,数据和页面都会同时发生改变.这个也不用多说,很简 ...
- 小程序setData方法使用总结
做了一下小程序setData使用方法总结,如有错误,请不吝指出,Thanks♪(・ω・)ノ //示例data: data:{ user:'young', obj:{ name:'蓝色蒲公英', ag ...
- 微信小程序 setData动态修改数据数组的值
1.问题说明 有一组数据,用来存储图片路径,动态修改图片的路径来上传图片,而小程序JS只能通过事件获取时机和setData方法修改数据来改变view. 而用这样写的方式明显是错误的 2.解决办法 字符 ...
- 微信小程序ES6方法Promise封装接口
为何要封装接口? 有小程序开发的经验者,相信对微信API Request很熟悉了.对接接口时,有大部分的开发者都是直接调用request方法,去请求后台接口并渲染数据.诚然,直接使用api发起请求对接 ...
- 微信小程序setData子元素
页面的数据中如果有子元素,如下图nowQuestion中的deleted元素 在小程序的setData中,不能直接用nowQuestion.deleted来设定它的值,而需要再定义一个变量承接 另外, ...
随机推荐
- 激活函数:Swish: a Self-Gated Activation Function
今天看到google brain 关于激活函数在2017年提出了一个新的Swish 激活函数. 叫swish,地址:https://arxiv.org/abs/1710.05941v1 pytorch ...
- Wow64
翻译自Wikipedia: WoW64 运行在微软平台上,WoW64(Windows 32-bit on Windows 64-bit) 是一个Windows的子操作系统, 它能运行32位的应用,在所 ...
- HLS协议详解
1. HLS HLS是为移动设备开发的基于HTTP的流媒体解决方案. 2. 原理: 将视频或流切分成小片(TS), 并建立索引(M3U8). 支持视频流:H.264: 音频流:AAC 3. M3U8文 ...
- adb 调试真机 wait for device 错误解决办法
起因 真机测试,使用adb安装和卸载应用时,出现wait for device. 解决办法 拔掉USB重新插入即可.
- nginx解决跨域(前后端分离)
Nginx解决跨域问题 后端接口 请求地址 返回数据(json数据) http://127.0.0.1:8080//app Hello World! 前端代码 通过nginx做静态资源服务器访问端口8 ...
- (14) openssl x509(签署和自签署)
主要用于输出证书信息,也能够签署证书请求文件.自签署.转换证书格式等. openssl x509工具不会使用openssl配置文件中的设定,而是完全需要自行设定或者使用该伪命令的默认值,它就像是一个完 ...
- svn服务
svn服务实战应用指南 1.1 svn介绍 什么是svn? svn(sub-version)是近年来崛起的非常优秀的版本管理工具,与cvs管理工具一样,svn是一个跨平台的开源的版本控制系统, ...
- 分享一款非常好用的Fatkun图片批量下载工具
Fatkun图片批量下载 相信大家一定遇到过有着大量精美图片的网页,譬如美女照片.各种壁纸.设计素材.甚至是1024套图等等,但常常几十上百张的图要一张张手工去点击下载实在能让人抓狂!小编的工作中也常 ...
- (十六)python 3 全局变量局部变量
全局变量和局部变量 全局变量与局部变量两者的本质区别就是在于作用域. 用通俗的话来理解的话,全局变量是在整个py文件中声明,全局范围内都可以访问.局部变量是在某个函数中声明的,只能在该函数中调用它,如 ...
- ul标签中,li标签的移除、属性值获取