微信小程序--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)
    }
相关推荐
爱勇宝11 小时前
小红花成长更新了:孩子想要什么,也应该有机会自己说出来
微信小程序·产品·小程序·云开发
普通人618 小时前
uniapp模版JS
开发语言·javascript·小程序·uni-app·1024程序员节
andrsted20 小时前
企业培训时间难统一?练题簿让在线免费刷题与培训考核更好安排
学习·微信小程序·小程序·学习方法·刷题
拖孩20 小时前
一个人 + AI 做的小程序,今天,正式回本了
前端·后端·微信小程序
李纲明1 天前
微信小程序 wx.uploadFile 上传失败:合法域名、临时路径与 HTTPS 证书排查
微信小程序·小程序·uploadfile·devdiy·上传失败
hnxaoli1 天前
win10小程序(二十四)批量新建文件夹
小程序
Ai-_Man1 天前
Meta Muse还是不可以导出左侧所有对话,只能点进去单条内容导出,方法不对吗?
开发语言·人工智能·ai·小程序·c#·1024程序员节
冬奇Lab1 天前
一天一个开源项目(第247篇):wxa-runner —— 让小程序在普通浏览器里用微信官方基础库跑起来,直接接 Playwright 做无头 E2E
微信小程序·开源
andrsted1 天前
练题簿在线免费刷题:让整理过的资料,变成能反复练习的题库
学习·微信小程序·小程序·学习方法·刷题·1024程序员节
CRMEB系统商城2 天前
家电零售的供应商协同与物流提效
java·开发语言·人工智能·小程序·1024程序员节