小程序基础

视图层-wxml-引用方式import和include

时间:2018/12/25 9:47:26  作者:互联网  来源:网络转载  查看:1607  评论:0
内容摘要:引用WXML 提供两种文件引用方式import和include。importimport可以在该文件中使用目标文件定义的template,如:在 item.wxml 中定义了一个叫item的template:

引用

WXML 提供两种文件引用方式importinclude

import

import可以在该文件中使用目标文件定义的template,如:

在 item.wxml 中定义了一个叫itemtemplate

<!-- item.wxml -->
<template name="item">
  <text>{{text}}</text>
</template>

在 index.wxml 中引用了 item.wxml,就可以使用item模板:

<import src="item.wxml" />
<template is="item" data="{{text: 'forbar'}}" />

import 的作用域

import 有作用域的概念,即只会 import 目标文件中定义的 template,而不会 import 目标文件 import 的 template。

如:C import B,B import A,在C中可以使用B定义的template,在B中可以使用A定义的template,但是C不能使用A定义的template

<!-- A.wxml -->
<template name="A">
  <text>A template</text>
</template>
<!-- B.wxml -->
<import src="a.wxml" />
<template name="B">
  <text>B template</text>
</template>
<!-- C.wxml -->
<import src="b.wxml" />
<template is="A" />
<!-- Error! Can not use tempalte when not import A. -->
<template is="B" />

include

include 可以将目标文件除了 <template/> <wxs/> 外的整个代码引入,相当于是拷贝到 include 位置,如:

<!-- index.wxml -->
<include src="header.wxml" />
<view>body</view>
<include src="footer.wxml" />
<!-- header.wxml -->
<view>header</view>
<!-- footer.wxml -->
<view>footer</view>

相关评论
评论者:      验证码:  点击获取验证码
咨询QQ/微信:45157718 点击这里给我发消息 | 电话:13516821613 | 浙江杭州余杭区东港路118号雷恩科技创新园 | 网站支持:杭州摇亿网络科技 | 浙ICP备06056032号-6 |