WXML 提供两种文件引用方式import和include。
import 可以在该文件中使用目标文件定义的 template:
建立一个 template 目录,在 template.wxml 中定义一个 name=student 的模板:
<!--pages/template/template.wxml--> <template name="student"> <view>id:{{id}}</view> <view>name:{{name}}</view> <view>age:{{age}}</view> </template>
在 wxml 目录下的 index.wxml 中引用 template.wxml,就可以使用 student 模板:
引用模板的时候,将数据 data 传入。
<import src="../template/template.wxml" /> <template is="student" data="{{...student}}"> </template>
index.js 中的 data 定义的 student 模板数据是:
data: { student:{ id:1, name:'张三', age:16 } },
需要注意的是 import 有作用域的概念,即只会 import 目标文件中定义的 template,而不会 import 目标文件中 import 的 template,简言之就是 import 不具有递归的特性。
例如:C 引用 B,B 引用A,在C中可以使用B定义的 template,在B中可以使用A定义的 template ,但是C不能使用A定义的template
include 可以将目标文件中除了 <template/> <wxs/>
外的整个代码引入,相当于是拷贝到 include 位置
index.wxml:
<include src="/pages/header/header.wxml"/> <view>This is body.</view> <include src="/pages/footer/footer.wxml"/>
header.wxml:
<view>This is header.</view>
footer.wxml:
<view>This is footer.</view>