当前位置:首页站长学院后端开发微信小程序如何使用template模板?
企业营销,就选知企PROSAAS

微信小程序如何使用template模板?

微信小程序如何使用template模板?

在小程序开发过程中,一个项目需要在多处页面使用类似的模块,就需要创建模板减少代码量,同时提高代码复用度。小程序通过template 标签使用模板,template 标签的 is 属性与模板的 name 属性对应,data 属性代表传入模板的数据。

在使用模板开发小程序前,需先定义模板,在开发项目中新建一个template文件夹用来管理项目中所有的模板。由于模板属于样式文件,因此新建一个courseList.wxml文件用于定义模板。使用name属性,作为模板的名字。然后在内定义代码片段。需要注意一个.wxml文件中可以定义多个模板,只需要通过name来区分。模板中的数据都是展开之后的属性。定义模板的代码如下:

微信小程序如何使用template模板?

在name中输入不同名称可以定义另一个完整的template,它们属于一个.WXML文件下,在使用模板中通过不同的名字调用定义的模板。使用 is 属性,声明需要的使用的模板:

import src=../../templates/courseList.wxml

将模板所需要的 data 传入,一般我们都会使用列表渲染。

微信小程序如何使用template模板?

值得注意的是,可以通过表达式来确定使用哪个模板,或者通过wx:if来确定。index是数组当前项的下标。

模板样式

在新建模板的时候同时新建一个courseList.wxss 的文件,与CSS同样的写法控制样式。

在需要使用模板的页面 .wxss文件中import进来;或者直接在app.wxss中引入,这样只需要一次引入,其他文件就不用引入了。

总结小程序模板使用主要为在同一个WXML文件中创建多个类似的模板用name属性来区别,模板WXSS在全局引入和在使用页面引入的区别在于模板的使用量。

推荐:《小程序开发教程》

以上就是微信小程序如何使用template模板?的详细内容,更多请关注知企PROSAAS其它相关文章!

温馨提示:

文章标题:微信小程序如何使用template模板?

文章链接:https://ceshi.prosaas.cn/16719.html

更新时间:2020年04月17日

声明: 本站大部分内容均收集于网络!若内容若侵犯到您的权益,请发送邮件至:973664285@qq.com我们将第一时间处理! 资源所需价格并非资源售卖价格,是收集、整理、编辑详情以及本站运营的适当补贴,并且本站不提供任何免费技术支持。 所有资源仅限于参考和学习,版权归原作者所有,更多请阅读知企PROSAAS协议

给TA打赏
共{{data.count}}人
人已打赏
后端开发

如何提取小程序的链接

2020-4-16 10:28:44

后端开发

30个小程序开发中常见问题和解决方法(总结)

2020-4-18 9:24:48

0 条回复 A文章作者 M管理员
    暂无讨论,说说你的看法吧
个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
搜索