小程序学习（AXML --- 1.数据绑定）

原创于 2022-04-29 14:07:24 发布 · 536 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#学习

AXML是用于描述小程序页面结构的语言，类似于HTML。

1.简单绑定

AXML中的数据与Page中的data中绑定，用{{}}括起来，类似于vue中用法，Page中的data更新，AXML中的数据也会实时更新。

2.组件属性，控制属性，关键字：需用双引号封装


<view id="item--{{id}}"  a:if="{{condition}}">
  Hello {{name}}!
</view>
<button hidden="{{false}}"> Click me! </button>

Page({
  data: {
    name: 'YANGLF',
    id: 0,
    condition: true
  }
}

3.组合，可直接在{{}}中组合，形成新的对象或数组。

<view a:for="{{[num],1,2,3}}"></view>

Page({
  data: {
      num: 0,
      name: 'YANGLF'
  }
})