微信小程序-setData()方法

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

注意:

  1. 直接修改 this.data 而不调用 this.setData 是无法改变页面的状态的,还会造成数据不一致
  2. 单次设置的数据不能超过1024kB,请尽量避免一次设置过多的数据。

方法如下:

js:

Page({
  data: {
    text: ‘init data‘,
    num: 0,
    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 = 1
    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>
时间: 2024-08-25 00:13:03

微信小程序-setData()方法的相关文章

微信小程序运营方法有哪些?

现在商家们都在疯狂注册微信小程序,开发一个小程序并不是一件很难的事情,但运营一个微信小程序对于商家来说才是最重要,运营好一个微信小程序,才能获利,下面木鱼小铺(https://www.muyu007.cn)就和大家分享一下微信小程序运营方法有哪些? 1.充分利用微信搜索入口,用小程序名称抢占排名 大家都知道小程序名称具有唯一性,小程序名称是影响排名的一个重要因素.所以取小程序名称的时候需要综合考虑用户的搜索习惯和产品特性,这样才能让你的小程序排名靠前,更加容易的被用户搜索到. 2.利用附近的小程

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

众所周知,微信小程序里所有对数据的修改只有在setData里修改才会在页面上渲染.在此分享小程序里复杂数组的更新.删除.添加.拼接 初始数据 数组嵌套对象 data: { cartList = [{ id: 1, goods: {id: 1, name: 'wechat'}, checked: true }, { id: 2, goods: {}, checked: false }, { id: 3, goods: {}, checked: true }] }, 索引部分删除 1 let ind

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

首先先介绍一下微信小程序Page.prototype.setData(Object data, Function callback)的讲解: setData函数用于将数据从逻辑层发送到视图层(异步),同时改变对应的this.data的值(同步) 微信小程序官网文档只对字符串,数字,数组和对象类型的数据通过对setData进行了修改,却没有对动态数据进行讲解,在这里我就针对静态数据以及动态数据的修改进行讲解. 这里关键是动态数据修改,通过使用[...]: "..."进行动态数据赋值,如下

小程序setData方法使用总结

做了一下小程序setData使用方法总结,如有错误,请不吝指出,Thanks?(?ω?)? //示例data: data:{ user:'young', obj:{ name:'蓝色蒲公英', age:'17' }, arr:[{ name:'Lucy', age: '18' },{ name:'半夏', age:'19' }] } 一.直接修改data的某个属性 this.setData({ user:'007' }); 二.修改data里的数组或对象的属性 this.setData({ 'o

微信小程序赚钱方法大全|都是谁适合利用小程序进行商业盈利?

微信小程序上线已经一年多的时间,小程序的入口也在不断的增加,功能也不断你的进行着迭代,很多创业者都看到了其中的创业商机,希望能抓住小程序这样的一波红利.但是如何能抓住小程序这波红利呢,如何切入微信小程序呢,现在小编和大家进行总结一下,进行全面分析,希望能给到大家想要的答案. 小程序商店 也就是"小程序聚合平台".前期收录所有小程序,进行免费展示.待知名度.访问量和转化量做起来后,转为收费模式(摊位费.推广费),如 速成应用. 本地服务 针对提供本地服务的商家或有众有品牌连锁加盟门店,利

微信小程序各种方法

获取手机的位置 wx.getLocation(function(res) { res.longitude: 经度 res.latitude: 纬度 }) 指定一个位置打开地图 wx.openLocation({ longitude: 经度 latitude: 纬度 }) 从地图上选择一个位置并获取该位置的信息 wx.chooseLocation({ success: function(res) { res: 返回的位置的信息对象 } }) 选择地址 wx.chooseAddress({ succ

微信小程序 setData动态设置数组中的数据

setdata传递动态数据值必须为对象(只能是key:value) 语法如下 this.setData({ filter: 1212 }) 如果setdata要传递数组呢? 首先相到的是 this.setData({ filter.a: 12 filter.b: 32 }) 这样回报语法错误 既然语法规定不能在里面写数组,那就把数组定义到外面 filter.selectArea1 = 1, filter.selectArea2 = 2, filter.selectArea3 = 3, this.

小程序-setData方法使用--改变默认数据data初始值方法

"resetdata":function(){//写触发函数绑定在页面上 this.setData({//this.setdata很重要 "changdata":"哈哈哈哈哈setData调用后文字"//重新设置data里面的"changdata"的值 }) }

微信小程序---setData

data:{ obj:{ name:'hello' } } 对data中obj的name字段进行重新赋值. onLoad: function (option) { var value = 'obj.name'; this.setData({ [value]:'world' }) console.log('obj',this.data.obj.name) } 原文地址:https://www.cnblogs.com/Super-scarlett/p/10042443.html