微信小程序--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)
    }
相关推荐
qq_12498707532 分钟前
基于微信小程序的垃圾分类信息系统(源码+论文+部署+安装)
java·前端·spring boot·后端·微信小程序·小程序·计算机毕业设计
qq_12498707537 分钟前
基于微信小程序的照片社交平台(源码+论文+部署+安装)
java·大数据·微信小程序·小程序·毕业设计·计算机毕业设计
Focussend智能化营销20 分钟前
【无标题】重构增长链路:如何将企业小程序从“成本中心”,改造为“利润中心”?
人工智能·小程序·重构·自动化·内容运营·数字化营销
游戏开发爱好者830 分钟前
在 iOS 开发、测试与上架过程中 如何做证书管理
android·ios·小程序·https·uni-app·iphone·webview
计算机毕设指导640 分钟前
基于微信小程序的健康管理系统【源码文末联系】
java·spring boot·微信小程序·小程序·tomcat·maven·intellij-idea
计算机毕设指导61 小时前
基于微信小程序的电影评论与推荐社区平台【源码文末联系】
java·spring boot·微信小程序·小程序·tomcat·maven·intellij-idea
weixin_177297220691 小时前
[特殊字符]旧物新生,交易无忧——旧物回收二手交易小程序,开启绿色生活新篇章[特殊字符]
小程序·生活
muzidigbig1 小时前
pc企微、小程序预览文件[‘pdf‘, ‘xlsx‘, ‘xls‘, ‘doc‘, ‘docx‘, ‘ppt‘, ‘pptx‘]
小程序·企业微信·pc企微打不开pdf·pc企微打不开文件
2501_916007472 小时前
在没有 Mac 的情况下完成 iOS 应用上架 App Store
android·macos·ios·小程序·uni-app·iphone·webview
说私域2 小时前
社交驱动下的商业模式进化:AI智能名片链动2+1模式S2B2C商城小程序的融合创新
人工智能·微信·小程序·开源