微信小程序中WXML模版语法-数据绑定方法介绍
1.数据绑定的基本原则
1>在data中定义数据
2>在WXML中使用数据
2.在data中定义页面的数据
在页面对应的.js文件中，把数据定义到data对象中即可：
page({
data:{
info:'init data'
}
})
3.Mustache语法的格式
把data中的数据绑定到页面中渲染，使用Mustache语法（双大括号）将变量包起来即可。语法格式为：
<view>{{info}}</view>//双括号中放入你想导入的数据
4.Mustache语法的应用场景
Mustache语法的主要应用场景为：
1>绑定内容
2>绑定属性
3>运算（三元运算、算术运算等）
5.动态绑定属性
页面的数据如下：
page({
data:{
imgSrc:'www.demo.com'
}
})
页面的结构如下：
<image src="{{imgSrc}}"></image>
6.三元运算
页面的数据如下：
page({
data:{
randomNum:Math.random()*10 //生成10以内的随机数
}
})
页面的结构如下：
<view>{{ randomNum >= 5 ? '随机数字大于等于5' : '随机数字小于等于 5'}}</view>
7.算术运算
让页面的数据如下：文章来源：https://www.toymoban.com/news/detail-658024.html
page({
data:{
randomNum:Math.random().toFixed(2) //生成一个带两位小数的随机数，例如 0.34
}
})
页面的结构如下：文章来源地址https://www.toymoban.com/news/detail-658024.html
<view>生成100以内的随机数：{{ randomNum * 100}}</view>
到了这里，关于微信小程序中WXML模版语法-数据绑定方法介绍的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
