Abstract Node

This feature is supported from Mini Program base library version 1.9.6 and later.

Using Abstract Nodes in Components

For a node in a custom component template, its corresponding custom component is not determined by the component itself, but the custom component caller. In this case, you can declare that this node is an "abstract node".

For example, we can implement a selectable-group component by adding custom-radio or custom-checkbox to it. The wxml of this component is written as follows:

Code example:

Preview with Developer Tool

<!-- 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 an abstract node. It must be declared in the componentGenerics field:

{
  "componentGenerics": {
    "selectable": true
  }
}

Using Components with Abstract Nodes

When using the selectable-group component, you must specify the specific component as "selectable":

<selectable-group generic:selectable="custom-radio" />

As such, when a selectable-group component instance is generated, a "custom-radio" component instance is generated for the "selectable" node. Likewise, if you do the following:

<selectable-group generic:selectable="custom-checkbox" />

A "custom-checkbox" component instance is generated for the "selectable" node.

Note: The above-mentioned custom-radio and custom-checkbox must be included in the usingComponents definition field of the json file corresponding to this wxml.

{
  "usingComponents": {
    "custom-radio": "path/to/custom/radio",
    "custom-checkbox": "path/to/custom/checkbox"
  }
}

Default Components of Abstract Nodes

You can specify a default component for an abstract node. When no specific component is specified, an instance of the default component is created. The default component can be specified in the componentGenerics field:

{
  "componentGenerics": {
    "selectable": {
      "default": "path/to/default/component"
    }
  }
}

Tips:

  • yyy in generic:xxx="yyy" referenced by the node's generic field must be a static value. Therefore, abstract nodes are not suitable for scenarios where the node name is determined dynamically.