微信小程序 教程之引用


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 相关文章推荐
javawscript 三级菜单的实现原理
Jul 01 Javascript
javascript 三种编解码方式
Feb 01 Javascript
jQuery对表单元素的取值和赋值操作代码
May 19 Javascript
jquery ajax属性async(同步异步)示例
Nov 05 Javascript
javascript 动态修改css样式方法汇总(四种方法)
Aug 27 Javascript
JS实现IE状态栏文字缩放效果代码
Oct 24 Javascript
JS实现日期时间动态显示的方法
Dec 07 Javascript
浅谈bootstrap源码分析之tab(选项卡)
Jun 06 Javascript
基于webpack 实用配置方法总结
Sep 28 Javascript
详解VUE自定义组件中用.sync修饰符与v-model的区别
Jun 26 Javascript
详解Vue 全局变量,局部变量
Apr 17 Javascript
jsonp跨域获取百度联想词的方法分析
May 13 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
ThinkPHP的RBAC(基于角色权限控制)深入解析
2013/06/17 PHP
详解PHP对数组的定义以及数组的创建方法
2015/11/27 PHP
php 从一个数组中随机的取出若干个不同的数实例
2016/12/31 PHP
为数据添加append,remove功能
2006/10/03 Javascript
理解Javascript_01_理解内存分配原理分析
2010/10/11 Javascript
javascript + jquery实现定时修改文章标题
2014/03/19 Javascript
JavaScript数组常用操作技巧汇总
2014/11/17 Javascript
bootstrap fileinput完整实例分享
2016/11/08 Javascript
从零开始学习Node.js系列教程之基于connect和express框架的多页面实现数学运算示例
2017/04/13 Javascript
node通过npm写一个cli命令行工具
2017/10/12 Javascript
Vue通过URL传参如何控制全局console.log的开关详解
2017/12/07 Javascript
vue.js动画中的js钩子函数的实现
2018/07/06 Javascript
解决vue脚手架项目打包后路由视图不显示的问题
2018/09/20 Javascript
vue+vant实现商品列表批量倒计时功能
2020/01/13 Javascript
Node Mongoose用法详解【Mongoose使用、Schema、对象、model文档等】
2020/05/13 Javascript
详解如何使用React Hooks请求数据并渲染
2020/10/18 Javascript
vue+element table表格实现动态列筛选的示例代码
2021/01/14 Vue.js
[06:21]完美世界亚洲区首席发行官竺琦TI3采访
2013/08/26 DOTA
[03:12]完美世界DOTA2联赛PWL DAY9集锦
2020/11/10 DOTA
python中常用的九种预处理方法分享
2016/09/11 Python
python+matplotlib实现礼盒柱状图实例代码
2018/01/16 Python
Django 跨域请求处理的示例代码
2018/05/02 Python
Python3内置模块之base64编解码方法详解
2019/07/13 Python
Python用摘要算法生成token及检验token的示例代码
2020/12/01 Python
基于python+selenium自动健康打卡的实现代码
2021/01/13 Python
pandas数据分组groupby()和统计函数agg()的使用
2021/03/04 Python
德国团购网站:Groupon德国
2018/03/13 全球购物
苏格兰销售女装、男装和童装的连锁店:M&Co
2018/03/16 全球购物
Hanro官网:奢华男士和女士内衣、睡衣和家居服
2018/10/25 全球购物
文秘专业毕业生就业推荐信
2013/11/08 职场文书
地理教师岗位职责
2014/03/16 职场文书
建房协议书
2014/04/11 职场文书
汽车4S店前台接待岗位职责
2015/04/03 职场文书
初中历史教学反思
2016/02/19 职场文书
创业计划书之家政服务
2019/09/18 职场文书
基于PyQt5制作一个群发邮件工具
2022/04/08 Python