This article mainly introduces the relevant information cited by WeChat applet, and attaches simple example code. Friends in need can refer to the
series of articles:
WXSS of WeChat applet tutorial
Quotation of WeChat Mini Program Tutorial
Events of WeChat Mini Program Tutorial
Template of WeChat Mini Program Tutorial
List Rendering of WeChat Mini Program Tutorial
Conditional Rendering of WeChat Mini Program Tutorial
Data Binding of WeChat Mini Program Tutorial
WXML of WeChat Mini Program Tutorial
Reference
WXML provides two file reference methods, import and include.
import
import can use the template defined by the target file in this file, such as:
in item.wxml A template called item is defined in:
<!-- item.wxml --> <template name="item"> <text>{{text}}</text> </template>
If item.wxml is referenced in index.wxml, you can use the item template:
<import src="item.wxml"/> <template is="item" data="{{text: 'forbar'}}"/>
import scope
Import has the concept of scope, that is, it will only import the template defined in the target file, but not the template imported by the target file.
For example: C import B, B import A, the template defined by B can be used in C, and the template defined by A can be used in B, but C cannot use the template defined by A.
<!-- A.wxml --> <template name="A"> <text> A template </text> </template>
<!-- B.wxml --> <import src="a.wxml"/> <template name="B"> <text> B template </text> </template>
<!-- C.wxml --> <import src="b.wxml"/> <template is="A"/> <!-- Error! Can not use tempalte when not import A. --> <template is="B"/>
include
include can introduce the entire code of the target file out of , which is equivalent to copying to the include location, such as:
<!-- index.wxml --> <include src="header.wxml"/> <view> body </view> <include src="footer.wxml"/>
<!-- header.wxml --> <view> header </view>
<!-- footer.wxml --> <view> footer </view>
Thank you for reading, I hope it can help everyone, thank you everyone for your support of this site!
The above is the detailed content of WeChat applet reference tutorial. For more information, please follow other related articles on the PHP Chinese website!