系列文章:

微信小程序 教程之WXSS
微信小程序 教程之引用
微信小程序 教程之事件
微信小程序 教程之模板
微信小程序 教程之列表渲染
微信小程序 教程之条件渲染
微信小程序 教程之数据绑定
微信小程序 教程之WXML

引用

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="http://1219.www.qixoo.qixoo.com/article/item.wxml"/>
<template is="item" data="http://qkxue.net/article/{{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="http://1219.www.qixoo.qixoo.com/article/a.wxml"/>
<template name="B">
<text> B template </text>
</template>
<!-- C.wxml -->
<import src="http://1219.www.qixoo.qixoo.com/article/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="http://1219.www.qixoo.qixoo.com/article/header.wxml"/>
<view> body </view>
<include src="http://1219.www.qixoo.qixoo.com/article/footer.wxml"/>
<!-- header.wxml -->
<view> header </view>
<!-- footer.wxml -->
<view> footer </view>
感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!

微信小程序 教程之引用的更多相关文章

  1. 微信小程序之微信登陆 —— 微信小程序教程系列(20)

    简介: 微信登陆,在新建一个微信小程序Hello World项目的时候,就可以看到项目中出现了我们的微信头像,其实这个Hello World项目,就有一个简化版的微信登陆.只不过是,还没有写入到咱们自 ...

  2. 微信小程序教程系列

    微信小程序教程系列 来源:       https://blog.csdn.net/michael_ouyang/article/details/56846185 相关连接:http://blog.c ...

  3. 微信小程序教程汇总

    目前市面上在内测期间出来的一些实战类教程还是很不错的,主要还是去快速学习小程序开发的整体流程,一个组件一个组件的讲的很可能微信小程序一升级,这个组件就变了,事实本就如此,谁让现在是内测呢.我们不怕,下 ...

  4. 微信小程序 教程及示例

    作者:初雪链接:https://www.zhihu.com/question/50907897/answer/128494332来源:知乎著作权归作者所有,转载请联系作者获得授权.微信小程序正式公测, ...

  5. 微信小程序教程(第三篇)

    小程序的架构及实现机制,信道服务及会话管理 小程序架构及实现机制 小程序并不是 H5 应用,而是更偏向于传统的 CS 架构,它是基于数据驱动的模式,一切皆组件(视图组件).所以建议在开发小程序时不要以 ...

  6. 微信小程序教程(第四篇)

    小程序开发基本框架及其限制与优化 开发基本框架(MINA框架) └─ Project-folder/ ·································· 项目所在目录 ├─ page ...

  7. 微信小程序教程(第二篇)

    如何注册接入小程序及搭建开发环境 小程序接入流程 注册 主要分为注册邮箱与信息登记. 需要重新申请一个新的微信公众帐号,不能使用服务号.订阅号或企业号使用的公众帐号 (微信公众帐号分为四种类型:订阅号 ...

  8. 微信小程序教程(第一篇)

    目录 第一篇小程序概述 第二篇如何注册接入小程序及搭建开发环境 第三篇小程序的架构及实现机制,信道服务及会话管理 第四篇小程序开发基本框架及其限制与优化 第五篇小程序开发项目实例,测试及发布 .... ...

  9. 一个小时快速搭建微信小程序教程

    「小程序」这个划时代的产品发布快一周了,互联网技术人都在摩拳擦掌,跃跃欲试.可是小程序目前还在内测,首批只发放了 200 个内测资格(泪流满面).本以为没有 AppID 这个月就与小程序无缘了,庆幸的 ...

随机推荐

  1. iOS空心圆下载进度指示器控件

    self.layer = [CAShapeLayer layer]; self.layer.frame = CGRectMake(, , , ); self.layer.position = self ...

  2. iOS 性能调试

    性能调优的方式: 1.通过专门的性能调优工具 2.通过代码优化 1. 性能调优工具: 下面针对iOS的性能调优工具进行一个介绍: 1.1 静态分析工具–Analyze 相信iOS开发者在App进行Bu ...

  3. RecyclerView 的介绍以及多布局的实例

    RecyclerView 的使用以及多布局的实例 RecyclerView 是在Android5.0之后推出的,是一个比ListView更加灵活更加高效的适配器类型控件.但是RecyclerView不 ...

  4. Git从码云Clone代码到本地

    Git从码云或者Github 克隆代码到本地 1.下载安装Git,傻瓜式下一步下一步即可... 2.配置Git: 2.1.选择你要clone到本地的路径:右键--->$ Git Bash Her ...

  5. 关于 Xcode8打印JSON的时候,NSLog控制台显示不完整

    看到打印结果之后  为什么只打印了一部分???为什么呢??? 我也不知道为什么,可能是xcode8的原因. 借鉴了下国外人说了,printf可以打印全,自己写了个输出宏 #ifdef DEBUG #d ...

  6. js动态绑定click事件时function传参问题

    今天碰到了这样一个问题,我在javascript中动态创建了一个button, 然后我想给改button添加click事件,绑定的function想要传入一个变量参数, 一开始我想直接通过函数传参传进 ...

  7. SSIS 实例——将SQL获取的信息传递到Email中

    最近在为公司财务开发一个邮件通知时遇到了一个技术问题.原来我设计SSIS的是每天将ERP系统支付数据导出到财务支付平台后 Email 通知财务,然后财务到支付平台上进行支付操作.由于那个时候开发时间很 ...

  8. ORACLE推导参数Derived Parameter介绍

    Oracle的推导参数(Derived Parameters)其实是初始化参数的一种.推导参数值通常来自于其它参数的运算,依赖其它参数计算得出.官方文档关于推导参数(Derived Parameter ...

  9. [Bind(Exclude = "OrderId")][ScaffoldColumn(false)]

    [Bind(Exclude = "OrderId")] 的意思是:View里的Model,在你提交给 Action时,不会绑定到Action的参数Model,默认它会绑定. mvc ...

  10. 实现从Oracle增量同步数据到GreenPlum

    简介: GreenPlum是一个基于PostgreSQL数据库开发的MPP架构的数据库仓库,适用于OLAP系统,支持50PB(1PB=1000TB)级海量数据的存储和处理. 背景: 目前有一个业务是需 ...