微信小程序 教程之引用


Posted in Javascript onOctober 18, 2016

系列文章:

引用

WXML提供两种文件引用方式import和include。

import

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

在item.wxml中定义了一个叫item的template:

<!-- 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/>的整个代码引入,相当于是拷贝到include位置,如:

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

感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

Javascript 相关文章推荐
超级酷和最实用的jQuery实例收集(20个)
Apr 21 Javascript
js中浮点型运算BUG的解决方法说明
Jan 06 Javascript
使用jQuery管理选择结果
Jan 20 Javascript
快速掌握jQuery插件开发
Jan 19 Javascript
js实现年月日表单三级联动
Apr 17 Javascript
JS实现简易刻度时钟示例代码
Mar 11 Javascript
微信小程序使用checkbox显示多项选择框功能【附源码下载】
Dec 11 Javascript
详解如何webpack使用DllPlugin
Sep 30 Javascript
Vue实例的对象参数options的几个常用选项详解
Nov 08 Javascript
解决vue项目中页面调用数据 在数据加载完毕之前出现undefined问题
Nov 14 Javascript
nuxt+axios实现打包后动态修改请求地址的方法
Apr 22 Javascript
JS 5种遍历对象的方式
Jun 16 Javascript
Angular2中Bootstrap界面库ng-bootstrap详解
Oct 18 #Javascript
微信小程序 教程之事件
Oct 18 #Javascript
微信小程序 教程之模板
Oct 18 #Javascript
微信小程序 教程之列表渲染
Oct 18 #Javascript
微信小程序 教程之条件渲染
Oct 18 #Javascript
微信小程序 教程之数据绑定
Oct 18 #Javascript
vue.js通过自定义指令实现数据拉取更新的实现方法
Oct 18 #Javascript
You might like
基于mysql的bbs设计(一)
2006/10/09 PHP
php笔记之:文章中图片处理的使用
2013/04/26 PHP
PHP简单处理表单输入的特殊字符的方法
2016/02/03 PHP
PHP访问数据库集群的方法小结
2016/03/14 PHP
在JQuery dialog里的服务器控件 事件失效问题
2010/12/08 Javascript
Javascript绝句欣赏 一些经典的js代码
2012/02/22 Javascript
js querySelector和getElementById通过id获取元素的区别
2012/04/20 Javascript
jquery实现倒计时代码分享
2014/06/13 Javascript
javascript 获取浏览器版本
2015/01/21 Javascript
JS实现的生成随机数的4个函数分享
2015/02/11 Javascript
JavaScript把数组作为堆栈使用的方法
2015/03/20 Javascript
JavaScript给input的value赋值引发的关于基本类型值和引用类型值问题
2015/12/07 Javascript
Bootstrap弹出框(modal)垂直居中的问题及解决方案详解
2016/06/12 Javascript
JS+HTML5实现的前端购物车功能插件实例【附demo源码下载】
2016/10/17 Javascript
jquery 实现回车登录详解及实例代码
2016/10/23 Javascript
jQuery+ajax的资源回收处理机制分析
2017/01/07 Javascript
简单谈谈require模块化jquery和angular的问题
2017/06/23 jQuery
浅谈微信JS-SDK 微信分享接口开发(介绍版)
2018/08/15 Javascript
element ui table(表格)实现点击一行展开功能
2018/12/04 Javascript
小程序hover-class点击态效果实现
2019/02/26 Javascript
layui 表单标签的校验方法
2019/09/04 Javascript
解决LayUI加上form.render()下拉框和单选以及复选框不出来的问题
2019/09/27 Javascript
Vuex,iView UI面包屑导航使用扩展详解
2019/11/04 Javascript
js仿360开机效果
2019/12/26 Javascript
关于AngularJS中几种Providers的区别总结
2020/05/17 Javascript
基于javascript实现放大镜特效
2020/12/03 Javascript
[05:29]2014DOTA2国际邀请赛 赛后专访:LGDNewbee顺利过关
2014/07/13 DOTA
简单介绍使用Python解析并修改XML文档的方法
2015/10/15 Python
python 利用栈和队列模拟递归的过程
2018/05/29 Python
浅谈pyqt5中信号与槽的认识
2019/02/17 Python
Python基于scipy实现信号滤波功能
2019/05/08 Python
html5 worker 实例(二) 图片变换效果
2013/06/24 HTML / CSS
办公室文秘岗位职责
2013/11/15 职场文书
办公室内勤岗位职责范本
2013/12/09 职场文书
高效课堂标语
2014/06/26 职场文书
2016个人先进事迹材料范文
2016/03/01 职场文书