微信小程序学习之template模板的使用

news/2024/7/20 3:19:33 标签: 小程序

问题背景

A页面有代码

<view>
   <button>点击我</button>
   ........                            //此处省略n行
</view>

B页面也有相同代码

<view>
   <button>点击我</button>
   .......
</view>

那么我们使用传统的在每个页面中写这些相同的代码是不是会感觉既繁琐代码又多呢?使用模板就可以很好的解决了这个问题

模板使用

模板复用:也就是说写一个模板,我们就可以在很多页面如A,B,C,D等页面使用。
,不仅仅是复用,还能让我们很好的对代码进行维护
1.编写模板代码
我们可以创建一个新目录,里面放一个.wxml文件,文件代码

<template name="indexItem">
   你好世界
</template>

在这里插入图片描述
其中name=“indexItem” 是模板的名字
2.模板引入
在想使用模板的页面引入

<import src="/pages/index-item-template/index-template.wxml" />

src=“模板文件路径”
3.使用

is=“模板名字”

<template is="indexItem"></template>

想使用哪个模板,就给哪个模板的名字就行啦


http://www.niftyadmin.cn/n/1869647.html

相关文章

linux技术内幕 pdf_哪些书是技术人必看的?先推荐12本吧

一直以来&#xff0c;有很多朋友会问我&#xff1a;要提升某个方向&#xff0c;要看什么书&#xff1f;你作为架构师&#xff0c;看过哪些书&#xff1f;...看书是技术人提升的核心渠道&#xff0c;世界读书日就在本月&#xff0c;这个周末我把自己的书架翻了一遍&#xff0c;准…

移动设备分辨率

1.逻辑分辨率 pt 简单来说就是视觉上的单位&#xff0c;与我们的屏幕的物理尺寸有关 2.物理分辨率 px 可以理解为像素点&#xff0c;相同pt下&#xff0c;像素点越多&#xff0c;物理分辨率越高,但不是越高越好&#xff0c;这是因为人眼会有识别上线,下图的Reader为2x和3x的其实…

mysql分区和分表哪个好_日本精工表哪个型号好,Seiko精工5号机械男表值得购买吗...

精工表早已名声在外&#xff0c;尤其记得8、9十年代&#xff0c;那个时候的精工、卡西欧甚至比劳力士更家喻户晓。说到精工就不得不提当家的精工5号&#xff0c;最初的定义出现在1960年代&#xff0c;也就是石英shock之前。1.防震(diashock)2.自动上链3.日历4.星期历5.(生活)防…

Nginx、OpenResty和Kong的基本概念与使用方法

说明Nginx Nginx配置文件&#xff0c;指令与变量Nginx作为TCP/UDP负载均衡器Nginx模块OpenResty OpenResty安装Kong Kong编译安装启动Kong部署Kong DashboardKong的使用 注册API&#xff1a;添加服务、配置路由插件启用方法Kong的插件Kong与Kubernetes的集成遇到的问题 ERROR: …

HTTP学习之了解Web及网络基础(一)

1.1使用HTTP协议访问Web 你知道当我们在网页浏览器(Web browser)的地址栏中输入URL时&#xff0c;Web页面时如何呈现的吗&#xff1f; 1.在浏览器地址栏输入URL之后&#xff0c;信息会被送往某处 2.在某处获得回复&#xff0c;内容酒会显示在Web页面上 Web页面当然不能凭空显示…

python 数据分析 实际案例_【Python】数据分析基本过程及案例

本文目录一维数组二维数组数据分析基本过程Python数据分析案例总结一、一维数组Numpy和Pandas包的一维数组Numpy&#xff08;Numerical Python&#xff09;中的一维数组称为Array&#xff1b;Pandas中的一维数组称为Series。1.Numpy一维数组(1)查询元素&#xff1a;用下标索引来…

python input 文件名_教程:Python拆分基因筛选数据

在科研过程中&#xff0c;我们通常要对大量实验数据文件进行拆分、拼接等操作&#xff0c;例如电池充放电循环、原位XRD数据等等。今天&#xff0c;谭编给大家分享利用Python编程对基因筛选数据文件进行拆分的编程教程。前一段时间&#xff0c;一位本校生科院的同事寻求帮助&am…

第一章 安装OpenResty(Nginx+Lua)开发环境

首先我们选择使用OpenResty&#xff0c;其是由Nginx核心加很多第三方模块组成&#xff0c;其最大的亮点是默认集成了Lua开发环境&#xff0c;使得Nginx可以作为一个Web Server使用。借助于Nginx的事件驱动模型和非阻塞IO&#xff0c;可以实现高性能的Web应用程序。而且OpenRest…