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

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

赋值一定需要注意。需要setData的使用,这样页面才刷新,数据才会改变,并且分清that和this的使用
Page() 函数用来注册一个页面。接受一个 object 参数,其指定页面的初始数据、生命周期函数、事件处理函数等。其中的参数data用来设置初始数据,WXML 中的动态数据均来自对应 Page 的 data。

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

  • 页面js文件中这么写:

    Page({
      data: {
        message: 'Hello MINA!'
      }
    })
    
  • wxml中这么写:

    <view> {{ message }} </view>
    

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

function setData(){
    var that = this;
    that.setData({
      message: '新消息'
    })
}
  • 如果想在js文件中使用data中的数据写法如下:

    function getData(){
        var that = this;
        console.log(that.data.message)
    }
    
相关推荐
李宥小哥15 分钟前
微信小程序06-综合项目点餐系统
微信小程序·小程序·notepad++
说私域4 小时前
构建有温度的用户关系:开源 AI 智能名片、链动 2+1 模式与 S2B2C 商城小程序的作用
人工智能·小程序
说私域4 小时前
社交电商中“信任”基础与“链动 2+1 模式 O2O 商城小程序”的价值探索
小程序
I592O9297834 小时前
大健康裂变分销小程序开发
小程序
前端-文龙刚4 小时前
小程序给对象赋值(双向绑定)方法之一
服务器·小程序·apache
fakaifa7 小时前
八戒农场小程序V2最新源码
小程序·uni-app·php·生活·开源软件
包淼淼7 小时前
微信小程序自定义navigationBar顶部导航栏(背景图片)适配所有机型,使用tdesign-miniprogram t-navbar设置背景图片
微信小程序·小程序·tdesign
2401_844137957 小时前
JAVA同城生活新引擎外卖跑腿团购到店服务多合一高效系统小程序源码
微信·微信小程序·小程序·生活·微信公众平台·微信开放平台
哈尔滨财富通科技7 小时前
财富通公司开发维修售后小程序,解决售后维修问题
大数据·小程序·云计算·售后小程序·哈尔滨小程序
我非夏日8 小时前
小程序开发设计-第一个小程序:注册小程序开发账号②
小程序