微信小程序 教程之引用


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的温度计动画效果
Jun 18 Javascript
使用jquery修改表单的提交地址基本思路
Jun 04 Javascript
JS给Textarea文本框添加行号的方法
Aug 20 Javascript
如何检测JavaScript的各种类型
Jul 30 Javascript
浅谈js中的三种继承方式及其优缺点
Aug 10 Javascript
用自定义图片代替原生checkbox实现全选,删除以及提交的方法
Oct 18 Javascript
你应该知道的几类npm依赖包管理详解
Oct 06 Javascript
Vue通过URL传参如何控制全局console.log的开关详解
Dec 07 Javascript
解决vue 打包发布去#和页面空白的问题
Sep 04 Javascript
Windows下Node爬虫神器Puppeteer安装记
Jan 09 Javascript
js实现html滑动图片拼图验证
Jun 24 Javascript
vue-cli中实现响应式布局的方法
Mar 02 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
用PHP实现小型站点广告管理
2006/10/09 PHP
相对路径转化成绝对路径
2007/04/10 PHP
PHP基础学习小结
2011/04/17 PHP
仿校内登陆框,精美,给那些很厉害但是没有设计天才的程序员
2008/11/24 Javascript
Node.js中使用socket创建私聊和公聊聊天室
2015/11/19 Javascript
基于jquery实现的仿优酷图片轮播特效代码
2016/01/13 Javascript
Vue.js每天必学之指令系统与自定义指令
2016/09/07 Javascript
Angularjs 实现一个幻灯片示例代码
2016/09/08 Javascript
DOM 事件的深入浅出(二)
2016/12/05 Javascript
详解Vue用axios发送post请求自动set cookie
2017/05/10 Javascript
Node.js自定义实现文件路由功能
2017/09/22 Javascript
react-native使用leanclound消息推送的方法
2018/08/06 Javascript
VSCode插件安装完成后的配置(常用配置)
2020/08/24 Javascript
浅析Python基础-流程控制
2016/03/18 Python
python批量下载网站马拉松照片的完整步骤
2018/12/05 Python
解决python Markdown模块乱码的问题
2019/02/14 Python
Django实现学员管理系统
2019/02/26 Python
Python传递参数的多种方式(小结)
2019/09/18 Python
Python Tornado实现WEB服务器Socket服务器共存并实现交互的方法
2020/05/26 Python
深入理解Python 多线程
2020/06/16 Python
Python3 pyecharts生成Html文件柱状图及折线图代码实例
2020/09/29 Python
scrapy头部修改的方法详解
2020/12/06 Python
CSS3实现精美横向滚动菜单按钮
2017/04/14 HTML / CSS
法国购买二手电子产品网站:Asgoodasnew
2020/03/27 全球购物
如何获取某个日期是当月的最后一天
2013/12/05 面试题
自我鉴定范文
2013/11/10 职场文书
工程开工庆典邀请函
2014/02/01 职场文书
计算机毕业生自荐信范文
2014/03/23 职场文书
房产买卖委托公证书
2014/04/04 职场文书
小学学雷锋活动总结
2014/04/25 职场文书
天地会口号
2014/06/17 职场文书
另类冲刺标语
2014/06/24 职场文书
2015年餐厅服务员工作总结
2015/04/23 职场文书
居住证明范文
2015/06/17 职场文书
Java实现扫雷游戏详细代码讲解
2022/05/25 Java/Android
SQL Server携程核心系统无感迁移到MySQL实战
2022/06/01 SQL Server