小程序template模板include和import引入模板

一、template

定义模板：
用 template 标签包裹起来的内容，都属于模板内容，整个结构就叫模板。
默认不显示，若需要显示则用 is 来渲染。

• 如果在同一个 wxml 文件中
  例子：

1. 先定义一个模板，它是默认不显示的

<template name="tw">
    <view>
        {{msg}}
    </view>
</template>

1. 然后在结构中要用到的时候 用 is 来渲染

   
   

<template is="tw" data="{{msg}}"></template> <!-- msg请自行在js文件中的data定义内容 -->

1. 如果在不同的 wxml 文件中,则要通过 import 的方法引入
   例子：

   
   

写模板的one.wxml:

<template name="one">
    <view wx:for="{{arr}}">
        {{item}}
    </view>
</template>

需要引入模板的wxml:

<!-- 通过 import 标签引入外部模板 -->
<import src="../template/one.wxml" />
<!-- 下面实例中的one是one.wxml中的一个定义的模板名称-->
<template is="one" data="{{arr}}"></template>
<!-- arr请自行在js文件中的data定义内容 -->

二、include

include 也可以引入外部文件
其可以将目标文件 除了 <template/> <wxs/> 外的整个代码引入

不同文件
例子：
写模板的 header.wxml :

<view>头部</view><template name="one2">
    <view>
        {{msg}} 
    </view>
</template>

需要引入模板的 wxml 文件 :

<include src="../template/header.wxml"></include>

结果就是 只有 “头部” 两个字 才能渲染出来，而名称为 “one2”  的模板不会显示 。

三、include，import 的 区别：

import  就是用来引入 模板，
include  是引入普通的 wxml 内容，但 不会 引入 模板。

链接：https://www.jianshu.com/p/52bd88a1c4ee