tencent cloud

文档反馈

抽象节点

最后更新时间:2024-03-04 23:07:33

    在组件中使用抽象节点

    在腾讯云小程序平台开发中,有时自定义组件模板中的一些节点,其对应的自定义组件不是由自定义组件本身确定的,而是自定义组件的调用者确定的。这时可以把这个节点声明为“抽象节点”。
    例如,我们现在来实现一个“选框组”(selectable-group)组件,它其中可以放置单选框(custom-radio)或者复选框(custom-checkbox)。这个组件的 wxml 可以这样编写:
    <!-- selectable-group.wxml -->
    <view qq:for="{{labels}}">
    <label>
    <selectable disabled="{{false}}"></selectable>
    {{item}}
    </label>
    </view>
    其中,“selectable”不是任何在 json 文件的 usingComponents 字段中声明的组件,而是一个抽象节点。它需要在 componentGenerics 字段中声明:
    {
    "componentGenerics": {
    "selectable": true
    }
    }

    使用包含抽象节点的组件

    在使用 selectable-group 组件时,必须指定“selectable”具体是哪个组件:
    <selectable-group generic:selectable="custom-radio" />
    在使用 selectable-group 组件时,必须指定“selectable”具体是哪个组件:
    <selectable-group generic:selectable="custom-checkbox" />
    “selectable”节点则会生成“custom-checkbox”组件实例。
    说明:
    上述的 custom-radio 和 custom-checkbox 需要包含在这个 wxml 对应 json 文件的 usingComponents 定义段中。
    {
    "usingComponents": {
    "custom-radio": "path/to/custom/radio",
    "custom-checkbox": "path/to/custom/checkbox"
    }
    }

    抽象节点的默认组件

    抽象节点可以指定一个默认组件,当具体组件未被指定时,将创建默认组件的实例。默认组件可以在 componentGenerics 字段中指定:
    {
    "componentGenerics": {
    "selectable": {
    "default": "path/to/default/component"
    }
    }
    }
    说明:
    节点的 generic 引用generic:xxx="yyy"中,值yyy只能是静态值,不能包含数据绑定。因而抽象节点特性并不适用于动态决定节点名的场景。
    
    联系我们

    联系我们,为您的业务提供专属服务。

    技术支持

    如果你想寻求进一步的帮助,通过工单与我们进行联络。我们提供7x24的工单服务。

    7x24 电话支持