文章目录
一、必须明确
wxml中的动态数据是来自js文件中Page中的Data,所以我们要创造动态数据就需要先在Data中准备数据。
二、怎么用
在Data中的数据已经准备好了,怎么用?
答:使用 Mustache 语法(双大括号)将变量包起来
1、在标签中的内容使用
准备数据(在.js文件中的Page下的Data中)
使用数据(在.wxml文件中使用)
效果截图
2、在组件属性中使用(即[id="{{数据名称}}"][class="[{{数据名称}}]等)
准备数据(在.js文件中的Page下的Data中)
使用数据(在.wxml文件中使用)
效果截图
3、在控制属性中使用(即[wx:if="{{数据名称}}"][wx:for="{{数据名称}}"]等)
准备数据(在.js文件中的Page下的Data中)
使用数据(在.wxml文件中使用)
效果截图
4、在关键字中使用(如复选框,即使用bool类型充当属性checked)
准备数据:准备的数据就是boolean类型
使用数据(在.wxml文件中使用)
效果截图
5、在算术运算中的使用(如加减乘除)
准备数据
使用数据(在.wxml文件中使用)
效果截图
6、在三元运算中的使用
直接在wxml文件中使用
效果截图
7、在逻辑运算中的使用
准备数据
使用数据
效果截图
8、在拼接字符串中使用
准备数据
使用数据
效果截图
9、在数据路径的运算中使用
准备数据
使用数据
效果截图
10、在{{}}内进行组合,构造成一个新的数组或对象
准备数据
使用数据
效果截图
三、写在后面
以上是自己在学习微信小程序时的一点小总结,有出错的地方,欢迎读者朋友们评论指正,谢谢。