<legend id="h4sia"></legend><samp id="h4sia"></samp>
<sup id="h4sia"></sup>
<mark id="h4sia"><del id="h4sia"></del></mark>

<p id="h4sia"><td id="h4sia"></td></p><track id="h4sia"></track>

<delect id="h4sia"></delect>
  • <input id="h4sia"><address id="h4sia"></address>

    <menuitem id="h4sia"></menuitem>

    1. <blockquote id="h4sia"><rt id="h4sia"></rt></blockquote>
      <wbr id="h4sia">
    2. <meter id="h4sia"></meter>

      <th id="h4sia"><center id="h4sia"><delect id="h4sia"></delect></center></th>
    3. <dl id="h4sia"></dl>
    4. <rp id="h4sia"><option id="h4sia"></option></rp>

        0411-39943997
        工作时间:周一至周日 8:30-22:00
        技术文库
        Technical Library

        小程序视图层WXML具有什么能力

        标签: 小程序开发  访问: 20572018-01-26

        WXML

        WXML(WeiXin Markup Language)是框架设计的一套标签语言,结合基础组件、事件系统,可以构建出页面的结构。

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

        数据绑定

         {{message}} 
        // page.jsPage({
          data: {
            message: 'Hello MINA!'
          }
        })

        列表渲染

         {{item}} 
        // page.jsPage({
          data: {
            array: [1, 2, 3, 4, 5]
          }
        })

        条件渲染

         WEBVIEW  APP  MINA 
        // page.jsPage({
          data: {
            view: 'MINA'
          }
        })

        模板

        
          
            FirstName: {{firstName}}, LastName: {{lastName}}  
        // 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
            })
          }
        })

        具体的能力以及使用方式在以下章节查看:

        数据绑定、列表渲染、条件渲染、模板、事件、引用

        Copyright© 2015 仟亿科技,All rights reserved.