一般setData方法多用于点击后改变页面信息或者刷新后与后台交互获取最新的信息

注意:

  1. 直接修改 this.data 而不调用 this.setData 是无法改变页面的状态的,还会造成数据不一致
  2. 单次设置的数据不能超过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()方法的更多相关文章

  1. 微信小程序setData()方法的详解以及对数组/json操作

    此篇文章是本人对setData方法的一些理解,是查阅文档和查找一些其他资料综述的,有所不足希望指正! 直接进入正题! 一.setData()方法: 1.参数接受一个对象,以key,value的形式表示 ...

  2. 微信小程序 setData 的坑(转)

    最近在使用微信小程序的setData时,遇到了以下问题.如下: 官网文档在使用setData()设置数组对象的某个元素的属性时,是这么使用的: Page({ data: { array: [{text ...

  3. 微信小程序setData复杂数组的更新、删除、添加、拼接

    众所周知,微信小程序里所有对数据的修改只有在setData里修改才会在页面上渲染.在此分享小程序里复杂数组的更新.删除.添加.拼接 初始数据 数组嵌套对象 data: { cartList = [{ ...

  4. 微信小程序setData的使用,通过[...]进行动态key赋值

    首先先介绍一下微信小程序Page.prototype.setData(Object data, Function callback)的讲解: setData函数用于将数据从逻辑层发送到视图层(异步), ...

  5. 微信小程序 setData 如何修改动态数据?

    最近这段时间在写微信小程序,有一个页面需要动态修改 data 中的数据,而这里似乎是个坑. 1.正常修改 正常修改很简单,当触发 change 事件时,数据和页面都会同时发生改变.这个也不用多说,很简 ...

  6. 小程序setData方法使用总结

    做了一下小程序setData使用方法总结,如有错误,请不吝指出,Thanks♪(・ω・)ノ  //示例data: data:{ user:'young', obj:{ name:'蓝色蒲公英', ag ...

  7. 微信小程序 setData动态修改数据数组的值

    1.问题说明 有一组数据,用来存储图片路径,动态修改图片的路径来上传图片,而小程序JS只能通过事件获取时机和setData方法修改数据来改变view. 而用这样写的方式明显是错误的 2.解决办法 字符 ...

  8. 微信小程序ES6方法Promise封装接口

    为何要封装接口? 有小程序开发的经验者,相信对微信API Request很熟悉了.对接接口时,有大部分的开发者都是直接调用request方法,去请求后台接口并渲染数据.诚然,直接使用api发起请求对接 ...

  9. 微信小程序setData子元素

    页面的数据中如果有子元素,如下图nowQuestion中的deleted元素 在小程序的setData中,不能直接用nowQuestion.deleted来设定它的值,而需要再定义一个变量承接 另外, ...

随机推荐

  1. Python 函数的初识

    1.函数的初识 函数的作用:以功能为导向 减少代码重复 # 函数试编程 # 函数以功能(完成一件事)为导向,登录 注册, # 一个函数就是一个功能,一个函数只能写一个功能 # 何时需要 何时调用,随调 ...

  2. DEV Express中NavBarCointrol的使用

    尚未对内容进行删减,内容有偏差和冗余,谨慎阅读. 发现在后面,写在前面: 13,之前在Default模式下,之所以很多Appearance属性都起不到作用,是因为Control的LookAndFeel ...

  3. django1.11 启动错误:Generator expression must be parenthesized

    错误信息: Unhandled exception in thread started by <function check_errors.<locals>.wrapper at 0 ...

  4. Linux的常用shell命令技巧集

    1.删除0字节文件 find -type f -size 0 -exec rm -rf {} ; 2.查看进程 按内存从大到小排列 ps -e -o "%C : %p : %z : %a&q ...

  5. 【Codeforces 1083A】The Fair Nut and the Best Path

    [链接] 我是链接,点我呀:) [题意] 题意 [题解] 我们最后要的是一条最长的路径. 这条路径的权值和是所有点的权值和-所有边的权值和且这个值最大. 显然如果我们在某一条边上的累计的权值和< ...

  6. 跟初学者学习IbatisNet第四篇

    这一章我们主要介绍一下IbatisNet里面的其它用法主要有以下几点: 1,如何得到运行时ibatis.net动态生成的SQL语句? 2,如何获取DbCommand? 3,如何返回DataTable, ...

  7. 大数据学习——linux系统的网卡配置步骤

    ifconfig 查看ip,没有ip时需要配置 配置步骤: 1输入命令setup,选择network configuration,选择runtool,选择device configuration,选择 ...

  8. PTA 05-树7 堆中的路径 (25分)

    题目地址 https://pta.patest.cn/pta/test/15/exam/4/question/713 5-5 堆中的路径   (25分) 将一系列给定数字插入一个初始为空的小顶堆H[] ...

  9. [转]eclipse的android智能提示设置

    以往 我们往往在输入 "." 然后 alt+/ 来进行智能提示,下面这个方法,可以帮你大幅度的提高智能打开 Eclipse -> Window -> Perferenc ...

  10. nginx反向代理ajax,解决跨域问题

    server { listen 8000; server_name somename alias another.alias; location /a { add_header 'Access-Con ...