孟习笔谈   游客访问数
本页目录

2.1WXML模版语法-数据绑定

发布时间:

1. 数据绑定的基本原则 ​

①在data 中定义数据
② 在WXML 中使用数据

2.在data 中定义页面的数据 ​

在页面对应的 js 文件中，把数据定义到 data 对象中即可：

js 
Page( {
    data: {
         //字符串类型的数据
        info: 'init data',
         imgSrc: 'http://ww.itheima.com/images/logo.png'
        // 数组类型的数据
        msglist: [{msg: 'hello'), {msg: 'world'}] 
    }
})

3. Mustache 语法的格式 ​

把data中的数据鄉定到页面中渲染，使用 Mustache 语法（双大括号） 将变量包起来即可。语法格式为：

js 
<view>{{ 要鄉定的数据名称 }}</view>

4.Mustache 语法的应用场景 ​

Mustache 语法的主要应用场景如下： •绑定内容

js 
<view>{{ 要鄉定的数据名称 }}</view>

•绑定属性

js 
  <image src="{{imgSrc))"></image>

•运算（三元运算、算术运算等）

js 
Page({
    data: {
      randomNum： Math. random(）* 10 // 生成 10 以内的随机数
    }
 })

页面的结构如下：

js 
<view>{{ randomNumber >= 5？“随机数字大于或等于5”：〝随机数字小于5’ }}</view>

Copyright © 2019-present meky