How to use template in WeChat applet?

In the process of mini program development, if a project needs to use similar modules on multiple pages, it is necessary to create templates to reduce the amount of code and increase code reuse. The applet uses the template through the template tag, the is attribute of the template tag corresponds to the name attribute of the template, and the data attribute represents the data passed into the template.

Before using templates to develop small programs, you need to define the template first and create a new template folder in the development project to manage all templates in the project. Since the template is a style file, create a new courseList.wxml file to define the template. Use the name attribute as the name of the template. Then define the code snippet inside it. It should be noted that multiple templates can be defined in a .wxml file and only need to be distinguished by name. The data in the template are all expanded attributes. The code to define the template is as follows:

Enter a different name in name to define another complete template. They belong to a .WXML file. When using the template, pass different The defined template is called by name. Use the is attribute to declare the template you need to use:

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

Pass in the data required by the template. Generally, we will use list rendering.

It is worth noting that which template to use can be determined by an expression, or by wx:if. index is the subscript of the current item in the array.

Template style

When creating a new template, create a new courseList.wxss file at the same time, and control the style in the same way as CSS.

Import it in the .wxss file of the page that needs to use the template; or directly introduce it in app.wxss, so that it only needs to be imported once, and other files do not need to be imported.

Summary: The use of mini program templates is mainly to create multiple similar templates in the same WXML file and use the name attribute to distinguish them. The difference between template WXSS introduced globally and introduced on the usage page lies in the usage of the template.

Recommendation: " Mini Program Development Tutorial"

The above is the detailed content of How to use template in WeChat applet?. For more information, please follow other related articles on the PHP Chinese website!