阅读更多系列文章请访问我的，示例代码请访问。该教程示例代码：/lesson03/pages/index/index.js、/lesson03/pages/index/index.wxml
WXML介绍WXML（WeiXinMarkupLanguage）是属于微信视图层的一套标签语言，它与Vue的模板语法很相似。
数据绑定与Vue语法一致，可以通过{{name}}将数据绑定到页面中，text标签默认为行内元素。
!--index.wxml--viewtext{{name}}/texttext{{age}}/textview{{name}}/viewview{{age}}/view/view列表渲染列表渲染的属性，也需要写在{{}}中，如wx:for="{{arr}}"，若写成wx:for="arr"会被当做字符串处理。
遍历出的item和index都是默认的，不需要像Vue一样写成item,indexinarr。值得注意的是，遍历的项目也需要提供一个key。
viewviewwx:for="{{arr}}"wx:key="{{index}}"{{item}}/view/view条件渲染通过wx:if、wx:elif、wx:else，分别可以实现if、else…if、else的条件渲染。
viewwx:if="{{judge}}"textjudge为true时显示/text/viewviewwx:elsetextjudge为false时显示/text/view模板小程序也同样支持template，可以给template标签设置name属性，表示该模板的名称。
在使用时通过is属性选择相应名称的template进行调用，并可以通过data属性传入相应参数。
!--wxml--templatename="staffName"viewFirstName:{{firstName}},LastName:{{lastName}}/view/templatetemplateis="staffName"data="{{...staffA}}"/templatetemplateis="staffName"data="{{...staffB}}"/templatetemplateis="staffName"data="{{...staffC}}"/template//index.jsPage({data:{staffA:{firstName:'Hulk',lastName:'Hu'},staffB:{firstName:'Shang',lastName:'You'},staffC:{firstName:'Gideon',lastName:'Lin'}}})事件为标签绑定事件，可以用bind+事件名作为属性，方法名称不需要用{{}}绑定，与Vue不同，绑定的方法不支持传参。
由于小程序运行在移动端，绑定点击事件不能用bindclick，而需要用bindtap。
而在方法中获取数据需要用this.data[propName]，修改数据需要用this.setData方法，这一点类似于React。
在Page(Object)构造器中，绑定的方法不用像Vue一样写在methods属性里，与data属性平级就可以。
!--wxml--buttontype="primary"bindtap="onTap"修改条件渲染/buttononTap(){this.setData({judge:!this.data.judge})}scroll-viewscroll-view用来创建一个滚动视图，但需要设置scroll-y="{{true}}才可开启纵轴方向的滚动，同时需要通过wxss设置高度，超出高度才会触发滚动。
scroll-viewscroll-y="{{true}}"style="height:100rpx;"viewwx:for="{{arr}}"wx:key="{{index}}"{{item}}/view/scroll-viewiconicon用来创建一个图标，它可以通过type属性使用微信的内置图标类型，如success,success_no_circle,info,warn,waiting,cancel,download,search,clear。
还可以通过size设置大小，color设置颜色，所有图标都是矢量图，不需要担心缩放问题。
若需要为图标插入文本，使用text标签即可。
icontype="success"size="23"color="green"/text成功/textnavigatornavigator类似于HTML中的a标签，可以通过url属性设置跳转地址，仅支持当前小程序内的跳转。
navigatorurl="/pages/login/login"跳转到login/navigatorradio和checkboxradio和checkbox都需要放在radio-group和checkbox-group标签中使用，前者用于实现单选功能，后者用于数据分组。
formaction=""radio-grouplabelwx:for="{{options}}"wx:for-item="item"wx:key="{{item.id}}"radiovalue="{{item.value}}"/{{item.name}}/label/radio-groupcheckbox-grouplabelwx:for="{{options}}"wx:for-item="item"wx:key="{{item.id}}"checkboxvalue="{{item.value}}"/{{item.name}}/label/checkbox-group/formpickerpicker可以创建一个选择器，默认的mode为普通选择器selector，它还支持多列选择器，时间选择器，日期选择器，省市区选择器。
picker的children可以是一个标签，点击children时会弹出选择器。
picker的range属性为必须，它可以绑定Array/ObjectArray，其值为选择器的选项，当其类型为ObjectArray时，需要用range-key属性指定选择器显示的内容。
picker的value属性为必须，绑定的是选中项目的index。
当选择器发生选择时，需要通过bindchange事件改变绑定的value值，bindchange的参数为event，其中event.detail={value:value}。
formpickermode="selector"range="{{options}}"value="{{pickerSelected}}"bindchange="onPickerChange"view{{pickerSelected}}/view/picker/formonPickerChange(event){this.setData({pickerSelected:event.detail.value})}