微信小程序--data的赋值与取值的几种方式

简介: 微信小程序--data的赋值与取值的几种方式

通过小程序官方文档可知:

赋值一定需要注意。需要setData的使用,这样页面才刷新,数据才会改变,并且分清that和this的使用


Page() 函数用来注册一个页面。接受一个 object 参数,其指定页面的初始数据、生命周期函数、事件处理函数等。其中的参数data用来设置初始数据,WXML 中的动态数据均来自对应 Page 的 data。


所以如果页面需要显示动态数据必须要把数据更新到data中对应的变量中。

  • 页面js文件中这么写:
1. Page({
2. data: {
3.     message: 'Hello MINA!'
4.   }
5. })
  • wxml中这么写:
<view> {{ message }} </view>

如果该数据在操作过程中发生变化,需要将新数据重新绑定到该变量中,写法如下:

function setData(){
    var that = this;
    that.setData({
      message: '新消息'
    })
}
  • 如果想在js文件中使用data中的数据写法如下:
function getData(){
    var that = this;
    console.log(that.data.message)
}
相关文章
|
小程序 开发工具
微信小程序-data和mark
经过之前的文章介绍,我们已经知道了,在事件当中如何进行数据的传递,那么在介绍当中有两种传递方式,那么这两种方式分别有什么区别呢,我们一起来看看吧~
185 0
|
存储 缓存 小程序
微信小程序的跨页面传参以及data-方法的相关细节
微信小程序的跨页面传参以及data-方法的相关细节
387 0
|
小程序
微信小程序setData赋值,数据未更新
微信小程序setData赋值,数据未更新
304 0
|
JSON 小程序 数据格式
微信小程序数据赋值错误不停地报 SyntaxError: Unexpected end of JSON input错误
微信小程序数据赋值错误不停地报 SyntaxError: Unexpected end of JSON input错误
312 0
微信小程序数据赋值错误不停地报 SyntaxError: Unexpected end of JSON input错误
|
小程序
微信小程序修改data中对象的属性值
微信小程序修改data中对象的属性值
230 0
|
2月前
|
小程序 JavaScript Java
微信小程序的后端开发需要使用什么语言?
【8月更文挑战第22天】微信小程序的后端开发需要使用什么语言?
321 65
ly~
|
8天前
|
存储 供应链 小程序
除了微信小程序,PHP 还可以用于开发哪些类型的小程序?
除了微信小程序,PHP 还可用于开发多种类型的小程序,包括支付宝小程序、百度智能小程序、抖音小程序、企业内部小程序及行业特定小程序。在电商、生活服务、资讯、工具、娱乐、营销等领域,PHP 能有效管理商品信息、订单处理、支付接口、内容抓取、复杂计算、游戏数据、活动规则等多种业务。同时,在企业内部,PHP 可提升工作效率,实现审批流程、文件共享、生产计划等功能;在医疗和教育等行业,PHP 能管理患者信息、在线问诊、课程资源、成绩查询等重要数据。
ly~
42 6
|
8天前
|
小程序 JavaScript API
微信小程序开发学习之页面导航(声明式导航和编程式导航)
这篇文章介绍了微信小程序中页面导航的两种方式:声明式导航和编程式导航,包括如何导航到tabBar页面、非tabBar页面、后退导航,以及如何在导航过程中传递参数和获取传递的参数。
微信小程序开发学习之页面导航(声明式导航和编程式导航)
|
2月前
|
小程序 JavaScript
Taro@3.x+Vue@3.x+TS开发微信小程序,使用轮播图
本文介绍了使用 Taro 和 Vue 创建轮播组件的两种方法:一是通过 `&lt;swiper&gt;` 实现,二是利用 Nut UI 的 `&lt;nut-swiper&gt;` 组件实现。
Taro@3.x+Vue@3.x+TS开发微信小程序,使用轮播图
|
28天前
|
移动开发 小程序 JavaScript
uni-app开发微信小程序
本文详细介绍如何使用 uni-app 开发微信小程序,涵盖需求分析、架构思路及实施方案。主要功能包括用户登录、商品列表展示、商品详情、购物车及订单管理。技术栈采用 uni-app、uView UI 和 RESTful API。文章通过具体示例代码展示了从初始化项目、配置全局样式到实现各页面组件及 API 接口的全过程,并提供了完整的文件结构和配置文件示例。此外,还介绍了微信授权登录及后端接口模拟方法,确保项目的稳定性和安全性。通过本教程,读者可快速掌握使用 uni-app 开发微信小程序的方法。
57 3
下一篇
无影云桌面