wxml语法：import导入

文章目录

import 介绍
import 案例

import 介绍

把模板定义到外部，然后多个页面间可以共用使用定义的模板WXML结构显示。（代码复用）

import：可以把一些常用自定义函数，写到一个文件中，在用的时候可以导入进来，然后再去调用里面的特定的函数。（按需使用）
作用：import可以在当前文件中使用目标文件定义的template（代码区块[标签]，可以有多个）。
语法：<import src="目标文件的路径"></import>
注意事项：

1. import的标签使用可以存在套娃行为，也就是说可以允许出现以下情况：在C文件中importB文件，在B文件中importA文件
2. import在套娃的时候需要注意，其使用template存在作用域的概念的。import导入，在使用时只能使用导入的目标文件的template，不能使用导入文件中的导入的目标文件的template。（不允许隔代使用）

import 案例

目录结构：
例如：有一个可被复用的目标文件asset.wxml，其代码如下：

<!-- 该文件是被引入的文件注意：1. 该文件可以看作是函数封装组件，里面存放封装的函数（代码段），函数定义是需要关键词function（template），而函数还需要函数名（name属性）2. 在这里面写几个代码段-->
<!-- template因为可以存在若干个，因此需要给每个template命名，让后续在复用的时候知道可以用哪个 --><template name="header"><view>头部部分</view></template><template name="list"><view>列表部分</view></template><template name="footer"><view>尾部部分，接收到的参数year：{{year}}</view></template>

在建立好刚才的文件后，我们可以在具体需要复用代码的位置进行导入和使用了：

<!--miniprogram/pages/import/import.wxml-->
<!-- 主体的页面，需要使用目标文件，因此得在这里导入目标文件导入的时候使用import标签，结合src属性使用在使用代码段的时候还支持高级用法，还支持给代码段传递参数，参数传递需要在使用template标签时给data属性传递，data是一个对象坑：import支持嵌套的，例如，当前import.wxml导入了asset.wxml,在asset.wxml中可以继续嵌套其他wxml文件。但是：请注意：在当前import.wxml中无法直接使用asset.wxml导入的其他文件中的template。也就是不允许隔代使用--><import src="./asset.wxml"></import><!-- 使用特定的代码段（函数） --><template is="header"></template><view>正文内容</view><!-- 给目标代码段绑定一个数据，数据为year，绑定多个用逗号隔开 --><template is="footer" data="{{year: 2021}}"></template>

运行结果：

wxml语法：import导入相关推荐

python导入模块的语法结构_python学习第五讲,python基础语法之函数语法,与Import导入模块....
python学习第五讲,python基础语法之函数语法,与Import导入模块. 一丶函数简介函数,就是一个代码块,这个代码块是别人写好的.我们调用就可以. 函数也可以称为方法. 1.函数语法定义 ...
【pythom】【if判断基本语法】【逻辑的运算and or not】【if语句的进阶elif】【if的嵌套】【import导入模块】【随机数的处理】
文章目录判断(if)语句 if 判断语句基本语法 2.2 判断语句演练 -- 判断年龄逻辑运算 `and` `or` not if 语句进阶`elif` `if` 的嵌套条件 2 不满足的处理 ...
WebStorm 自定义字体+颜色+语法高亮+导入导出用户设置
WebStorm 自定义字体+颜色+语法高亮+导入导出用户设置 WebStorm是一个捷克公司开发的,功能虽然很强大,但UI貌似一直不是东欧人的强项.WebStorm默认的编辑器颜色搭配不算讲究,我看 ...
小程序入门第二课 — 组件与WXML语法
小程序提供了一个简单.高效的应用开发框架和丰富的组件及API,帮助开发者在微信中开发具有原生 APP 体验的服务. 目录组件文字文本图标组件图片表单组件输入框按钮开关选择器从底部弹 ...
视图层、WXML语法、WXSS样式、事件、WXS脚本语法
一.微信小程序视图层框架的视图层由 WXML 与 WXSS 编写,由组件来进行展示.将逻辑层的数据反应成视图,同时将视图层的事件发送给逻辑层. ●WXML(WeiXin Markup languag ...
微信小程序（WXML语法、WXSS样式、事件系统、WXS脚本语法）
三.微信小程序视图层框架的视图层由 WXML 与 WXSS 编写,由组件来进行展示.将逻辑层的数据反应成视图,同时将视图层的事件发送给逻辑层. ●WXML(WeiXin Markup languag ...
【Intellij IDEA教程】怎么自动清除无效的import导入包、清除无效的import导入包的快捷键
[Intellij IDEA教程]怎么自动清除无效的import导入包.清除无效的import导入包的快捷键通常在使用Intellij IDEA进行项目开发的时候 Intellij IDEA会自动帮 ...
在python中、使用( )语句导入模块_Python import导入模块
python中的import语句是用来导入模块的,在python模块库中有着大量的模块可供使用,要想使用这些文件需要用import语句把指定模块导入到当前程序中. import语句作用 import语 ...
python 第三方包自动导入_7行代码，彻底告别python第三方包import导入问题！
最近有不少小伙伴咨询关于pyton第三方包导入的问题,今天我们就来聊聊第三方包导入那些事. 随着对python学习的渐入臻境,越来越多的小伙伴们开始导入自己所需的第三方包,实现各种各样的功能.但是,他 ...

wxml语法：import导入

文章目录

import 介绍

import 案例

wxml语法：import导入相关推荐

最新文章

热门文章