微信小程序 动态修改页面数据及参数传递过程详解


Posted in Javascript onSeptember 27, 2019

在小程序中我们经常要动态渲染数据,对于新手而言我们常常遇到修改的数据在控制台显示和页面显示不一致,因为我们用“=”修改数据的,这种是可以修改,但无法改变页面的状态的,还会造成数据不一致,代码如下:

data: {
  array: [{ text: '数组' }]
 }

onLoad:function(){
this.data.array[0].text=1;

console.log(this.data.array[0].text);
}

微信小程序 动态修改页面数据及参数传递过程详解

修改代码:

onLoad:function(){
  // this.data.array[0].text=1;
  this.setData({
   'array[0].text': '1'
  })
  console.log(this.data.array[0].text);
 }

微信小程序 动态修改页面数据及参数传递过程详解

总结:修改data的数据有两种方法

1、直接用“=”赋值,这种是可以修改,但无法改变页面的状态的,还会造成数据不一致。

2、this.setData,setData 函数用于将数据从逻辑层发送到视图层(异步),同时改变对应的 this.data 的值(同步)。

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript模块化是什么及其优缺点介绍
Sep 02 Javascript
JavaScript中获取样式的原生方法小结
Oct 08 Javascript
JS实现的自定义右键菜单实例二则
Sep 01 Javascript
window.onerror()的用法与实例分析
Jan 27 Javascript
关于JS中的apply,call,bind的深入解析
Apr 05 Javascript
jQuery版AJAX简易封装代码
Sep 14 Javascript
JS库之Particles.js中文开发手册及参数详解
Sep 13 Javascript
Scala解析Json字符串的实例详解
Oct 11 Javascript
使用javascript函数编写简单银行取钱存钱流程
May 26 Javascript
详解Vue项目引入CreateJS的方法(亲测可用)
May 30 Javascript
vue 解决computed修改data数据的问题
Nov 06 Javascript
js实现网页版贪吃蛇游戏
Feb 22 Javascript
vue实现购物车小案例
Sep 27 #Javascript
解决layui中onchange失效以及form动态渲染失效的问题
Sep 27 #Javascript
layui 地区三级联动 form select 渲染的实例
Sep 27 #Javascript
vue实现移动端省市区选择
Sep 27 #Javascript
vue实现表单录入小案例
Sep 27 #Javascript
解决LayUI加上form.render()下拉框和单选以及复选框不出来的问题
Sep 27 #Javascript
layui form.render('select', 'test2') 更新渲染的方法
Sep 27 #Javascript
You might like
PHP+Mysql日期时间如何转换(UNIX时间戳和格式化日期)
2012/07/15 PHP
php+highchats生成动态统计图
2014/05/21 PHP
DEFER怎么用?
2006/07/01 Javascript
javascript结合html5 canvas实现(可调画笔颜色/粗细/橡皮)的涂鸦板
2013/04/27 Javascript
jquery如何实现锚点链接之间的平滑滚动
2013/12/02 Javascript
js 异步操作回调函数如何控制执行顺序
2013/12/24 Javascript
使用JavaScript和C#中获得referer
2014/11/14 Javascript
nodejs教程之制作一个简单的文章发布系统
2014/11/21 NodeJs
javascript实现图片自动和可控的轮播切换特效
2015/04/13 Javascript
js判断当前页面在移动设备还是在PC端中打开
2016/01/06 Javascript
javascript使用 concat 方法对数组进行合并的方法
2016/09/08 Javascript
全面解析Bootstrap表单样式的使用
2016/09/09 Javascript
正则中的回溯定义与用法分析【JS与java实现】
2016/12/27 Javascript
Bootstrap 表单验证formValidation 实现表单动态验证功能
2017/05/17 Javascript
BootStrap Table前台和后台分页对JSON格式的要求
2017/06/28 Javascript
解决vue 格式化银行卡(信用卡)每4位一个符号隔断的问题
2018/09/14 Javascript
Angular 2使用路由自定义弹出组件toast操作示例
2019/05/10 Javascript
通过实例了解Javascript柯里化流程
2020/03/03 Javascript
9种python web 程序的部署方式小结
2014/06/30 Python
python正则分析nginx的访问日志
2017/01/17 Python
python 3.6 tkinter+urllib+json实现火车车次信息查询功能
2017/12/20 Python
Python3 Post登录并且保存cookie登录其他页面的方法
2018/12/28 Python
安装docker-compose的两种最简方法
2019/07/30 Python
Django中使用CORS实现跨域请求过程解析
2019/08/05 Python
Python全栈之列表数据类型详解
2019/10/01 Python
澳大利亚领先的亚麻品牌:Bed Threads
2019/12/16 全球购物
澳大利亚在线批发商:Simply Wholesale
2021/02/24 全球购物
烹调加工管理制度
2014/02/04 职场文书
新教师培训方案
2014/06/08 职场文书
群众路线查摆问题整改措施
2014/10/10 职场文书
初婚未育证明样本
2014/10/24 职场文书
十岁生日答谢词
2015/01/05 职场文书
2015入党自传格式范文
2015/06/26 职场文书
PyTorch 如何设置随机数种子使结果可复现
2021/05/12 Python
MySQL5.7并行复制原理及实现
2021/06/03 MySQL
MySQL三种方式实现递归查询
2022/04/18 MySQL