引入模板小程序的两种方法
编辑:小飞燕 发布时间:2021-03-12 08:44:40
在微信小程序的开发过程中,使用小程序模板可以使整个开发过程更简单,更容易操作,所以很多人会选择引入模板小程序。那么具体怎么介绍呢?这里有两种方法介绍模板小程序。
方法1:在公共模板中定义模板元素。通过使用该方法,将只显示公共模板的模板内部的内容,而不显示外部的内容
注意:这里,data='{{ imported data 1,imported data 2}} '是模板中要提取的小程序js函数文件中数据数据中的键名,否则无法显示
公共模板的wxml:必须定义公共模板中每个模板的名称,否则引用时不可能知道引用的是哪一个;
{{title.header}}
要引用的文件js定义数据:
数据: {
title:{header: '这是模板的页眉部分',footer: '这是模板的页脚部分',other: '这是tempalt外部部分' }
}
小程序页面结果:
方法2 :
这样就引入了模板中除tempalte以外的所有内容。
公共模板的wxml:
{{title.other}}
js定义的数据:
标题: {新闻中的页眉: '页眉',页脚: '这是模板的页脚部分' }
页面结果:
总结:导入和包含的区别在于,前者仅指公共模板中模板内部的内容,而后者仅指模板外部的内容。显然,include方法更简单,只需要wxml中的一句话。
下面是题目的开头。小程序布局的相对位置是什么意思?标题到此结束
小程序布局的相对位置是什么意思?微信小程序布局过程中,需要设置小程序标签的固定位置。小程序布局的相对位置是什么?除了相对位置,还有局对局的位置。接下来,我们将向您介绍他们。
小程序布局的相对位置是什么意思?
相对位置:元素相对于自身定位,引用对象就是自身。
位置:元素相对于比较近的父元素定位
小程序布局的相对位置:
位置:相对;/*启用相对定位*/
left:150rpx/* 150*/
top:50rpx/*偏离自己150*/
小程序布局的位置:
位置:
left: 50rpx
top: 50rpx
(必须定位父元素)
如何设置小程序布局的相对位置?
灵活方向:行(水平轴,默认)列(垂直轴)//这是一种常见的布局
(轴示例:父元素使用灵活布局,块级小程序元素将在默认布局中换行,但在设置灵活布局后,默认情况下它们都是水平排列的)
对齐-内容:伸缩-开始中心伸缩-结束空间-周围空间-中间空间
对齐项目:与对齐内容相同
flex-wrap(指定的子元素溢出处理): nowrap(无换行)wrap(顺序换行)wrap-reverse(反向换行)。微信小程序代码如下:
. item1{
height:100rpx
width:100rpx
背景色:青色;
border: 1px实心# fff
flex-grow: 1
}
. i3{
flex-grow: 2
}
微信小程序代码如下:表格{
border: 0px实心深灰色;
}。tr {
display: flex
宽度:;
justice-content : center;
height: 3rem
align-items : center;
}。td {
宽度:40%;
justice-content : center;
text-align:中心;
}。bg-w{
背景:雪;
}。bg-g{
background: # e6f3f9
}。th {
宽度:40%;
justice-content : center;
背景# 3366ff
color: # fff
display: flex
height: 3rem
align-items : center;
上一篇:微信小程序可以开发游戏吗
下一篇:微信小程序制作视频网站怎么弄