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

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

数据绑定

<!--wxml--> {{message}} 
// page.jsPage({
  data: {
    message: 'Hello MINA!'
  }
})
登录后复制

列表渲染

<!--wxml--> {{item}} 
// page.jsPage({
  data: {
    array: [1, 2, 3, 4, 5]
  }
})
登录后复制

条件渲染

<!--wxml--> WEBVIEW  APP  MINA IS NOT APP 
// page.jsPage({
  data: {
    view: 'MINA'
  }
})
登录后复制

模板

<!--wxml-->
// page.jsPage({
  data: {
    staffA: {firstName: 'Hulk', lastName: 'Hu'},
    staffB: {firstName: 'Shang', lastName: 'You'},
    staffC: {firstName: 'Gideon', lastName: 'Lin'}
  }
})
登录后复制

事件

 {{count}} 
Page({
  data: {
    count: 1
  },
  add: function(e) {    this.setData({
      count: this.data.count + 1
    })
  }
})
登录后复制

【相关推荐】

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

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

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

以上就是小程序开发之WXML详解的详细内容,更多请关注慧达安全导航其它相关文章!

点赞(0)

评论列表 共有 0 条评论

暂无评论
立即
投稿
发表
评论
返回
顶部