0

我正在尝试从另一个 FW 获取 StencilJS Web 组件类中定义的所有属性,该 FW 类似于 React 但专有(所以很遗憾我无法发布工作片段)。

这是在 Stencil 组件类的源代码中定义道具的方式:

import { EventEmitter } from '@stencil/core';
import { CssClassMap } from '../../utils/utils';
import { StyleSheet } from 'jss';
import Base from '../../utils/base-interface';

export declare class Link implements Base {
    /** (optional) Tag class */
    customClass?: string;
    /** (optional) Tag size */
    size?: string;
    /** (optional) Tag variant */
    variant?: string;
    /** (optional) Tag href */
    href?: string;
    /** (optional) Tag target */
    target?: string;
    
    /** (optional) Close icon click event */
    linkClose: EventEmitter<MouseEvent>;
    componentWillUpdate(): void;
    componentDidUnload(): void;
    handleClose(event: any): void;
    render(): any;
}

我在 Stencil 文档中的任何地方都找不到如何获取这些道具的列表。在输入中,我有它的 ref 或通过函数中的 simple 获得的节点document.querySelector元素componentDidMount

关于如何实现这一目标以及是否可能的任何想法?

谢谢你。

4

1 回答 1

1

尝试通过attributes(相当于 Stencil 道具)访问

const attributes = [];
const ref = document.querySelector('yourWebComponent');
for (i = 0, atts = ref.attributes, n = atts.length, arr = []; i < n; i++){
  attributes.push(atts[i].nodeName);
}
于 2021-02-25T09:46:21.467 回答