微信小程序学习10--小程序的模板功能template

模板用法

小程序提供了模板功能，使用模板可以将页面中的公共部分提取出来，实现复用的效果。

定义模板

• 使用 template 标签定义模板，指定 name 属性为模板命名

<!--定义模板 -->
<template name="mytpl">
  <view class="user">
  	<text>姓名: 小明</text>
    <text>年龄: 18</text>
  </view>
</template>

<template name='info'>
  <view>
    <view>用户名：{{uname}}</view>
    <view>年龄：{{age}}</view>
  </view>
</template>

应用模板

• 使用 template 标签应用模板，指定 is 属性确认应用哪个模板

<!-- 应用模板 -->
<template is="mytpl"></template>
<template is='info' data='{{uname: "JERRY", age: 13}}'></template>

引入文件用法

将模板定义在独立文件中，使用模板会更加灵活，可实现多页面的共享：

<!-- ./stu.wxml -->
<template name='stu'>
  <view>学生信息</view>
  <view wx:key='{{index}}' wx:for='{{stuList}}'>
    <view>学生姓名：{{item.sname}}</view>
    <view>考试分数：{{item.sscore}}</view>
  </view>
</template>

<!-- 导入模板 -->
<import src='./stu.wxml'/>
<!-- <template is='stu' data='{{stuList: [{sname: "lisi", sscore: 100}, {sname: "zhangsan", sscore: 99}]}}'></template> -->
<template is='stu' data='{{stuList: list}}'></template>