小程序开发之WXML详解

wxml(weixin markup language)是mina框架设计的一套标签语言，结合基础组件、事件系统，可以构建出页面的结构。

用以下一些简单的例子来看看WXML具有什么能力：

数据绑定

 !--wxml-- view {{message}} /view 
// page.jsPage({
 data: {
 message: #39;Hello MINA! #39;
})

列表渲染

 !--wxml-- view wx:for-items= {{array}} {{item}} /view 
// page.jsPage({
 data: {
 array: [1, 2, 3, 4, 5]
})

条件渲染

 !--wxml-- view wx:if= {{view == #39;WEBVIEW #39;}} WEBVIEW /view view wx:elif= {{view == #39;APP #39;}} APP /view view wx:else= {{view == #39;MINA #39;}} MINA IS NOT APP /view 
// page.jsPage({
 data: {
 view: #39;MINA #39;
})

模板

 !--wxml-- template name= staffName 
 view 
 FirstName: {{firstName}}, LastName: {{lastName}} /view /template template is= staffName data= {{...staffA}} /template template is= staffName data= {{...staffB}} /template template is= staffName data= {{...staffC}} /template 
// page.jsPage({
 data: {
 staffA: {firstName: #39;Hulk #39;, lastName: #39;Hu #39;},
 staffB: {firstName: #39;Shang #39;, lastName: #39;You #39;},
 staffC: {firstName: #39;Gideon #39;, lastName: #39;Lin #39;}
})

事件

 view bindtap= add {{count}} /view 
Page({
 data: {
 count: 1
 add: function(e) { this.setData({
 count: this.data.count + 1
})

【相关推荐】

1. 微信小程序完整源码下载

2. 简单的左滑操作和瀑布流布局

3. 追格微信小程序应用商店源码

以上就是小程序开发之WXML详解的详细内容，更多请关注php中文网其它相关文章！

最佳 Windows 性能的顶级免费优化软件

每个人都需要一台速度更快、更稳定的 PC。随着时间的推移，垃圾文件、旧注册表数据和不必要的后台进程会占用资源并降低性能。幸运的是，许多工具可以让 Windows 保持平稳运行。