怎么在微信小程序中使用template模版

怎么在微信小程序中使用template模版?很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。

员工经过长期磨合与沉淀,具备了协作精神,得以通过团队的力量开发出优质的产品。成都创新互联坚持“专注、创新、易用”的产品理念,因为“专注所以专业、创新互联网站所以易用所以简单”。公司专注于为企业提供网站设计制作、做网站、微信公众号开发、电商网站开发,微信小程序定制开发,软件定制网站等一站式互联网企业服务。

1. 创建 template 模版

不同于 page 和 Component 的创建, 在开发者工具中并不能快速创建一个 template 模版。所以需要单独创建 wxss wxml 文件。

怎么在微信小程序中使用template模版

template.wxml 文件语法

一个 template.wxml 文件中使用

template.wxss 模版样式文件

模版可以拥有自己的样式文件

text{
 color: #cccccc;
}

2. 引用 template 模版

  • template 模版的引用需要使用 标签。 该标签的 src 属性为需要引用模版的路径。

  • template 模版的使用用

    index.js

    Page({
     data: {},
     handleTap() {
     console.log('template 模版 click')
     }
    })

    5.  import 有作用域

    import 有作用域的概念,即只会 import 目标文件中定义的 template,而不会 import 目标文件中 import 的 template,简言之就是 import 不具有递归的特性。

    例如:C 引用 B,B 引用A,在C中可以使用B定义的 template,在B中可以使用A定义的 template ,但是C不能使用A定义的template

    6. include 配合 template 模版

    如同使用 引用和使用模版一样, 同样也可以使用 来引用一个模版。

    需要注意的是:

    • 使用 引用模版文件时, 并不能分别出模版文件的模版块, 所以使用 引用的模版文件中只能定义一个模版块。

    • include 可以将目标文件中除了