微信小程序 教程之引用


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 相关文章推荐
双击滚屏-常用推荐
Nov 29 Javascript
模仿JQuery sortable效果 代码有错但值得看看
Nov 05 Javascript
关于IE BUG与字符串截取substr的解决办法
Apr 10 Javascript
浅析js中取绝对值的2种方法
Jul 09 Javascript
JavaScript数据类型详解
Apr 01 Javascript
逐一介绍Jquery data()、Jquery stop()、jquery delay()函数(详)
Nov 04 Javascript
JavaScript实现设计模式中的单例模式的一些技巧总结
May 17 Javascript
Vue.JS入门教程之列表渲染
Dec 01 Javascript
js仿搜狐视频记录片列表展示效果
May 30 Javascript
详解vue-cli中配置sass
Jun 21 Javascript
微信小程序自定义顶部组件customHeader的示例代码
Jun 03 Javascript
一文带你理解vue创建一个后台管理系统流程(Vue+Element)
May 18 Vue.js
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
全国FM电台频率大全 - 21 海南省
2020/03/11 无线电
将RTF格式的文件转成HTML并在网页中显示的代码
2006/10/09 PHP
PHP学习 运算符与运算符优先级
2008/06/15 PHP
PHP中使用localhost连接Mysql不成功的解决方法
2014/08/20 PHP
PHP生成图片缩略图类示例
2017/01/12 PHP
Laravel 中使用 Vue.js 实现基于 Ajax 的表单提交错误验证操作
2017/06/30 PHP
模拟jQuery ajax服务器端与客户端通信的代码
2011/03/28 Javascript
面向对象的Javascript之一(初识Javascript)
2012/01/20 Javascript
原生js仿jq判断当前浏览器是否为ie,精确到ie6~8
2014/08/30 Javascript
jquery简单图片切换显示效果实现方法
2015/01/14 Javascript
jQuery实现模拟marquee标签效果
2015/07/14 Javascript
详解jQuery中的元素的属性和相关操作
2015/08/14 Javascript
详解AngularJS中的表单验证(推荐)
2016/11/17 Javascript
微信小程序手势操作之单触摸点与多触摸点
2017/03/10 Javascript
深入理解 JavaScript 中的 JSON
2017/04/06 Javascript
Bootstrap 模态对话框只加载一次 remote 数据的完美解决办法
2017/07/09 Javascript
微信小程序—setTimeOut定时器的问题及解决
2019/07/26 Javascript
[02:27]DOTA2英雄基础教程 莱恩
2014/01/17 DOTA
python中pandas.DataFrame的简单操作方法(创建、索引、增添与删除)
2017/03/12 Python
OpenCV实现人脸识别
2017/04/07 Python
如何使用VSCode愉快的写Python于调试配置步骤
2018/04/06 Python
关于Numpy数据类型对象(dtype)使用详解
2019/11/27 Python
Python pyautogui模块实现鼠标键盘自动化方法详解
2020/02/17 Python
python 已知一个字符,在一个list中找出近似值或相似值实现模糊匹配
2020/02/29 Python
浅谈keras中Dropout在预测过程中是否仍要起作用
2020/07/09 Python
CSS3中使用RGBa来调节透明度的教程
2016/05/09 HTML / CSS
Monnier Frères美国官网:法国知名奢侈品网站
2016/11/22 全球购物
美国眼镜网:GlassesUSA
2017/09/07 全球购物
J2EE的优越性主要表现在哪些方面
2016/03/28 面试题
自我评价的正确写法
2013/09/19 职场文书
物业保安员岗位职责制度
2014/01/30 职场文书
公司会议策划方案
2014/05/17 职场文书
化工实习心得体会
2014/09/09 职场文书
五四青年节活动总结
2015/02/10 职场文书
五一劳动节慰问信
2015/02/14 职场文书
音乐课《小猫钓鱼》教学反思
2016/02/18 职场文书