微信小程序 教程之引用


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 相关文章推荐
javaScript 判断字符串是否为数字的简单方法
Jul 25 Javascript
有关于JS辅助函数inherit()的问题
Apr 07 Javascript
JSON简介以及用法汇总
Feb 21 Javascript
移动端js触摸事件详解
Sep 18 Javascript
Vue.js render方法使用详解
Apr 05 Javascript
jQuery回调方法使用示例
Jun 26 jQuery
使用angular帮你实现拖拽的示例
Jul 05 Javascript
Javascript(es2016) import和require用法和区别详解
Aug 11 Javascript
Vue+ElementUI项目使用webpack输出MPA的方法
Aug 27 Javascript
layui 表格操作列按钮动态显示的实现方法
Sep 06 Javascript
浅谈Vue2.4.0 $attrs与inheritAttrs的具体使用
Mar 08 Javascript
vue-cli单页面预渲染seo-prerender-spa-plugin操作
Aug 10 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
单位速度在实战中的运用
2020/03/04 星际争霸
摩卡咖啡
2021/03/03 咖啡文化
一些关于PHP的知识
2006/11/17 PHP
php使用mb_check_encoding检查字符串在指定的编码里是否有效
2013/11/07 PHP
PHP中的日期加减方法示例
2014/08/21 PHP
php实现倒计时效果
2015/12/19 PHP
详解PHP中array_rand函数的使用方法
2016/09/11 PHP
php+redis实现消息队列功能示例
2019/09/19 PHP
filters.revealTrans.Transition使用方法小结
2010/08/19 Javascript
JS延时提示框实现方法详解
2015/11/26 Javascript
Node.js模块封装及使用方法
2016/03/06 Javascript
深入浅析JavaScript中with语句的理解
2016/05/12 Javascript
JS简单实现点击复制链接的方法
2016/08/03 Javascript
微信小程序 MINA文件结构
2016/10/17 Javascript
Bootstrap实现带暂停功能的轮播组件(推荐)
2016/11/25 Javascript
js处理包含中文的字符串实例
2017/10/11 Javascript
基于JS实现带动画效果的流程进度条
2018/06/01 Javascript
nodejs实现获取本地文件夹下图片信息功能示例
2019/06/22 NodeJs
在pycharm中开发vue的方法步骤
2020/03/04 Javascript
python字典多键值及重复键值的使用方法(详解)
2016/10/31 Python
python:解析requests返回的response(json格式)说明
2020/04/30 Python
Python基于进程池实现多进程过程解析
2020/04/30 Python
keras .h5转移动端的.tflite文件实现方式
2020/05/25 Python
Python爬虫爬取有道实现翻译功能
2020/11/27 Python
Python中的面向接口编程示例详解
2021/01/17 Python
KIKO比利时官网:意大利彩妆品牌
2017/07/23 全球购物
eBay瑞士购物网站:eBay.ch
2018/12/24 全球购物
国际政治个人自荐信范文
2013/11/26 职场文书
小学家长会邀请函
2014/01/23 职场文书
离婚协议书范文2015
2015/01/26 职场文书
建筑安全员岗位职责
2015/02/15 职场文书
2015年银行客户经理工作总结
2015/04/01 职场文书
离婚起诉状范本
2015/05/19 职场文书
幸福终点站观后感
2015/06/04 职场文书
使用这 6个Vue加载动画库来减少我们网站的跳出率
2021/05/18 Vue.js
Python实现批量自动整理文件
2022/03/16 Python