🔥码云GVP开源项目 12k star Uniapp+ElementUI 功能强大 支持多语言、二开方便! 广告
- ### WXML提供模板(template),可以在模板中定义代码片段,然后在不同的地方调用 ~~~ //定义模板 <template name="temp"> <view> <view>收件人:{{name}}</view> <view>联系方式:{{phone}}</view> </view> </template> //is使用模板 <template is="temp" data ="{{...item}}"> </template> ~~~ is 属性可以使用 Mustache 语法,来动态决定具体需要渲染哪个模板: ~~~ <template name="odd"> <view> odd </view> </template> <template name="even"> <view> even </view> </template> <block wx:for="{{[1, 2, 3, 4, 5]}}"> <template is="{{item % 2 == 0 ? 'even' : 'odd'}}"/> </block> ~~~ - ### 引用 WXML 提供两种文件引用方式`import`和`include`。 - import 只引入template模板 在 `item.wxml` 中定义了一个叫item的template ~~~ <!-- item.wxml --> <template name="item"> <text>{{text}}</text> </template> ~~~ 在`index.wxml`中引入 ~~~ <import src="item.wxml"/> <template is="item" data="{{text: 'forbar'}}"/> ~~~ - include include 可以将目标文件除了[template,wxs]() 外的整个代码引入,相当于是拷贝到 include 位置 ~~~ <!-- index.wxml --> <include src="header.wxml"/> <view> body </view> <include src="footer.wxml"/> ~~~ ~~~ <!-- header.wxml --> <view> header </view> ~~~ ~~~ <!-- footer.wxml --> <view> footer </view> ~~~