微信小程序＜template＞的使用

微信的模板就是谢公共代码，在主页面直接引入就行

1.模板的定义
首先在新建一个good文件夹，文件夹中新建一个good.wxml文件，在当前目录下还可以定义css，组件当中对应的js事件和data数据可以在主页面的js当中定义，这样就能保证每一个引入它的页面数据不同但是页面结构式一样的

<template name='good'>
	<view class='good' bindtap='goodDetail'>
		<image src="{{good.url}}" mode="aspectFill"></image>
		<view class='mask'></view>
		<view class='info'>
			<view class='title'>
				<text>{{good.name}}</text>
			</view>
			<view class='detail'>
				<view class='timeinfo'>
				<text>{{good.address}}</text>
				
				</view>
				<view class='address' >
				<text>{{good.km}}</text>
				
				</view>
			</view>

		</view>

		<view class='bottom'>
		<view class='price'>￥{{good.price}}</view>
		<view class='oldprice'>￥{{good.oldprice}}</view>
		<view class='selled'>已售{{good.sell}}</view>
		</view>
	</view>
</template>

2.模板的使用

1.在主页面的最上方先引入模板+

引入HTML：

<import src="../../components/good/good.wxml"/>

引入css：

@import '../../components/mystar/mystar.wxss';

2.使用template渲染模板

  <block  wx:for="{{goods}}" wx:for-item='good' wx:key='*this' >
    <template is="good" data="{{good:good}}"/>
  </block>

is=“good"表示调用模板的name
data=”{{good:good}}的意思是把把当前的wx:for-item的good赋值给模板template当中的good
（第一个good就是template当中的good，第二个good就是当前主页面的good），如果就单独一个数据就直接使用这种形式引入js当中的数据，多个数据就需要使用循环来插入数据

注意点：
注意：
（1）主页的template 标签的is属性与good.wxml中good标签的name属性值相同
（2）主页文件中要通过import标签声明需要使用的模板文件