May 17, 2021 WeChat Mini Program Development Document
This feature has been supported since the base library version 1.9.6 of the small program.
Sometimes, some nodes in a custom component template, whose corresponding custom components are determined not by the custom component itself, but by the caller of the custom component. This node can then be declared an "abstract node."
For example, we now implement a "selectable-group" component where you can place a custom-radio or checkbox. The wxml of this component can be written like this:
Code example:
<!-- selectable-group.wxml -->
<view wx:for="{{labels}}">
<label>
<selectable disabled="{{false}}"></selectable>
{{item}}
</label>
</view>
Where "selectable" is not any component declared in the usingComponents field of the json file, but is an abstract node. It needs to be declared in the componentGenerics field:
{
"componentGenerics": {
"selectable": true
}
}
When using selectable-group components, you must specify which component selectable is:
<selectable-group generic:selectable="custom-radio" />
This way, when an instance of this selectable-group component is generated, the selectable node generates an instance of the custom-radio component. Similarly, if you use this:
<selectable-group generic:selectable="custom-checkbox" />
The selectable node generates an instance of the custom-checkbox component.
Note: The custom-radio and custom-checkbox above need to be included in this wxml usingComponents definition segment for the json file.
{
"usingComponents": {
"custom-radio": "path/to/custom/radio",
"custom-checkbox": "path/to/custom/checkbox"
}
}
Abstract nodes can specify a default component, and instances of the default component are created when the specific component is not specified. The default component can be specified in the componentGenerics field:
{
"componentGenerics": {
"selectable": {
"default": "path/to/default/component"
}
}
}
Tips: