微信小程序模板 template 的使用

template可以理解为：通用模板、通用函数，就是可以在多个地方重复使用，可以减少代码冗余，也管理方便，使用比较方便。

举个栗子：

如图所示，像购物类小程序，猜您喜欢这种板块一般都会在多个地方出现，咱们可以把wxml里的代码提取出来，放到template里，通过数据传输，就可以达到不同地方使用同一样式，展示内容不一样的效果。

就算遇到需要调整样式，也一点都不用慌，因为就改一个地方而已。

下面贴代码

template.wxml

• name：模板名字

• list：由调用页面传输过来的数据列表，当然数据可以是数组、字符串等等。

<!-- 商品排列通用样式 -->
<template name="goods-style">
	<block wx:for="{{list}}" wx:key="">
		<view class="list">
			<navigator url="{{item.url}}">
				<image src="{{item.icon}}"></image>
				{{item.goodsname}}
			</navigator>
		</view>
	</block>
</template>

引用template

<import src="../template/template.wxml" />

@import "../template/template.wxss";

页面使用

<template is="goods-style" data="{{listName:list,size:300}}"></template>

data里放入的就是需要传输的参数，可以多个。实例传的商品列表和展示宽度。可根据实际情况在不同页面展示不同大小的效果。