微信小程序 data对象赋值和取值_小程序 searchdata 对象赋值-优快云博客

本文链接：https://blog.youkuaiyun.com/liuDuke1/article/details/108071701

本文介绍了微信小程序中data对象的赋值和取值方法，包括显示静态数据和动态数据的处理。通过在WXML中取值和JS中使用onShow动态加载数据，结合wx:for实现列表渲染。熟悉官方文档是掌握微信小程序开发的关键。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

微信小程序 data对象赋值和取值

显示静态数据

往data赋值

Page({
 data: {
    motto: 'Hello World'
  }
})

在***.wxml这样子取data对象的属性

<view "{{motto}}"></view>

显示响应的动态数据

在js中这样子写

function setData(){
    var _this= this;
    that.setData({
      message: '新消息'
    })
}

我就举一个简单的例子用onShow去动态加载数据让页面显示响应的动态数据

  onShow: function () {
    var _this=this;
    console.log(_this.data.motto);
    wx.request({
      url: 'http://gx58s6.natappfree.cc/AppInfoSystem/dev/flatform/app/categorylevellist.json',
      data: {
        pid: '1',
        categoryLevel: "categoryLevel1"
      },
      headers: {
        'Content-Type': 'application/json'
      },
      success: function (res) {
        if (res.data != '' && res != null) {
          _this.setData({
            categorylevellist:res.data
          })
          console.log(_this.data.categorylevellist);
        }
      }
    })
  }

使用列表渲染 wx:for
在组件上使用 wx:for 控制属性绑定一个数组，即可使用数组中各项的数据重复渲染该组件。
默认数组的当前项的下标变量名默认为 index，数组当前项的变量名默认为 item

<view wx:for="{{categorylevellist}}">
  {{index}}: {{item.message}}
</view>

其实你只要学会了看微信开发文档,其实开发一个微信小程序是很简单的啦
话不多说直接上微信官方文档