微信小程序實戰(zhàn)系列教材：
1.微信小程序?qū)崙?zhàn)開發(fā)（一）：微信小程序簡介
2.微信小程序?qū)崙?zhàn)開發(fā)（二）：小程序基本目錄結(jié)構(gòu)講解
3.微信小程序?qū)崙?zhàn)開發(fā)（三）：小程序視圖容器（view container）
4.微信小程序?qū)崙?zhàn)開發(fā)（四）：組件的基本使用講解
5.微信小程序?qū)崙?zhàn)開發(fā)（五）：數(shù)據(jù)綁定講解
6.微信小程序實戰(zhàn)開發(fā)(六)：渲染標(biāo)簽的使用

在小程序的開發(fā)過程中，我們很可能會遇到多個頁面部分布局代碼相同的情況，界面與界面之間可能會有很多重復(fù)的樣式，然而這些樣式的代碼，每次都要重新寫就很麻煩了，而且也浪費資源，微信小程序像其他開發(fā)一樣，也有樣式模板的使用方式。我們今天要介紹的就是樣式模板的使用方法(include和import)。

1.使用include的方式包含模板樣式
例如：<include src="../templates/myText" /> 首先我們需要創(chuàng)建一個文件夾用來存放樣式模板，我們以text組件模板為例：

然后我們在需要引用改模板的頁面中使用<include src="../templates/header" />導(dǎo)入即可。我們可以看到顯示結(jié)果如下圖所示：

使用這種方式引用模板，實際上就是等同于把templates中的header的代碼全部復(fù)制到include這里

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

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

同樣，我們在templates下創(chuàng)建一個footer.wxml,我們創(chuàng)建兩個底部布局，其代碼如下

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

我們在newvip.wxml頁面中導(dǎo)入這兩個底部樣式的方法如下，（因為有兩個樣式，所以我們需要用template is來指定使用哪一個樣式）

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

調(diào)試運行后的結(jié)果如下：

小結(jié)：
1.通過include調(diào)用，相當(dāng)于把被調(diào)用文件里面的內(nèi)容全部都復(fù)制進來。
2.import需要用is聲明調(diào)用哪個樣式，不是全部復(fù)制

本節(jié)注意：

1.<include />結(jié)尾處有/

2.<template is="footer2" />結(jié)尾也要有/

愛盈利（aiyingli.com）移動互聯(lián)網(wǎng)最具影響力的盈利指導(dǎo)網(wǎng)站。定位于服務(wù)移動互聯(lián)網(wǎng)創(chuàng)業(yè)者，移動盈利指導(dǎo)。我們的目標(biāo)是讓盈利目標(biāo)清晰可見！降低門檻，讓缺乏經(jīng)驗、資金有限的個人和團隊獲得經(jīng)驗和機會，提高熱情，激發(fā)產(chǎn)品。