微信小程序实战系列教材：
1.微信小程序实战开发（一）：微信小程序简介
2.微信小程序实战开发（二）：小程序基本目录结构讲解
3.微信小程序实战开发（三）：小程序视图容器（view container）
4.微信小程序实战开发（四）：组件的基本使用讲解
5.微信小程序实战开发（五）：数据绑定讲解
6.微信小程序实战开发(六)：渲染标签的使用

在小程序的开发过程中，我们很可能会遇到多个页面部分布局代码相同的情况，界面与界面之间可能会有很多重复的样式，然而这些样式的代码，每次都要重新写就很麻烦了，而且也浪费资源，微信小程序像其他开发一样，也有样式模板的使用方式。我们今天要介绍的就是样式模板的使用方法(include和import)。

1.使用include的方式包含模板样式
例如：<include src="../templates/myText" /> 首先我们需要创建一个文件夹用来存放样式模板，我们以text组件模板为例：

然后我们在需要引用改模板的页面中使用<include src="../templates/header" />导入即可。我们可以看到显示结果如下图所示：

使用这种方式引用模板，实际上就是等同于把templates中的header的代码全部复制到include这里

2.使用import的方式引用模板

1. <!--模板样式的使用  底部样式-->
   
2. <import src="../templates/footer"  />
   
3. <template is="footer1" />

同样，我们在templates下创建一个footer.wxml,我们创建两个底部布局，其代码如下

1. <template name="footer1">
   
2. 51小程序-底部布局1
   
3. </template>
   
4. 
   
5. <template name="footer2">
   
6. 51小程序-底部布局2
   
7. </template>

我们在newvip.wxml页面中导入这两个底部样式的方法如下，（因为有两个样式，所以我们需要用template is来指定使用哪一个样式）

1. <!--模板样式的使用，底部样式-->
   
2. <import src="../templates/footer" />
   
3. <template is="footer1" />
   
4. <!--模板样式的使用，底部样式-->
   
5. <import src="../templates/footer" />
   
6. <template is="footer2" />

调试运行后的结果如下：

小结：
1.通过include调用，相当于把被调用文件里面的内容全部都复制进来。
2.import需要用is声明调用哪个样式，不是全部复制

本节注意：

1.<include />结尾处有/

2.<template is="footer2" />结尾也要有/

爱盈利（aiyingli.com）移动互联网最具影响力的盈利指导网站。定位于服务移动互联网创业者，移动盈利指导。我们的目标是让盈利目标清晰可见！降低门槛，让缺乏经验、资金有限的个人和团队获得经验和机会，提高热情，激发产品。