微信小程序（三） --- js文件

独坐空山后

于 2020-04-28 19:50:11 发布

阅读量243

点赞数

CC 4.0 BY-SA版权

分类专栏：微信小程序文章标签：小程序

本文链接：https://blog.youkuaiyun.com/pig_is_duck/article/details/105822215

微信小程序专栏收录该内容

10 篇文章

订阅专栏

本文详细解析了微信小程序中data属性的使用方法，包括存储组件数据的作用，以及如何通过data属性展示字符串、数字、布尔值、对象等不同类型的变量。同时，介绍了data属性在标签属性和自定义属性中的应用。

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

生命周期在另一篇博客里《微信小程序（五）—生命周期》

1、data: {}

作用：用于存储该组件的数据，与vue类似
实例

 data: {
    msg: 'Hello mina',
    num: 1000,
    isGirl: false,
    person: {
      age: 74,
      height: 145,
      name: 'duck'
    }
  },

<!-- 1 字符串 -->
<view>{{msg}}</view>
<!-- 2 数字 -->
<view>{{num}}</view>
<!-- 3 布尔 -->
<view>是否是女生：{{isGirl}}</view>
<!-- 4 对象 -->
<view>{{person.age}}</view>
<view>{{person.height}}</view>
<view>{{person.name}}</view>

<!-- 5 在标签的属性钟使用 -->
<view data-num="{{num}}">自定义属性</view>

<!-- 6 使用boolean充当属性 -->
<view>
  <checkbox checked="{{isGirl}}">自定义属性</checkbox>
</view>