Stencil @Element 找不到子节点
Stencil @Element not finding child node
我有 Web 组件，我试图通过 @Element select 子节点 属性:
export class StepupVerification {
@Prop() token: string = 'test';
@State() url: string = `http://localhost:8080/?fail=${this.token}`;
@Element() private element: HTMLElement;
...
但是，当我知道该元素存在时，我在该项目上使用的查询 select 返回零个子项。我知道，因为我可以在相同的 select 或不同的文档中找到它。
这是 select 或者我正在使用的：
this.element.querySelectorAll('.stepup-frame');
正如我所说，它 returns 零元素。但是当我使用时：
document.querySelectorAll('.stepup-frame');
我发现元素很好。
TL;DR: 元素上的 querySelector 对于我的 webcomponent 无法正常工作，我不确定为什么。
我真的很想使用 ref 功能来获取对嵌入元素的引用。
我能够向我的组件添加一个 private myElement: HTMLElement 变量，然后在我的代码中通过 this.myElement 引用它。
我有 Web 组件，我试图通过 @Element select 子节点 属性:
export class StepupVerification {
@Prop() token: string = 'test';
@State() url: string = `http://localhost:8080/?fail=${this.token}`;
@Element() private element: HTMLElement;
...
但是，当我知道该元素存在时，我在该项目上使用的查询 select 返回零个子项。我知道，因为我可以在相同的 select 或不同的文档中找到它。
这是 select 或者我正在使用的：
this.element.querySelectorAll('.stepup-frame');
正如我所说，它 returns 零元素。但是当我使用时：
document.querySelectorAll('.stepup-frame');
我发现元素很好。
TL;DR: 元素上的 querySelector 对于我的 webcomponent 无法正常工作，我不确定为什么。
我真的很想使用 ref 功能来获取对嵌入元素的引用。
我能够向我的组件添加一个 private myElement: HTMLElement 变量，然后在我的代码中通过 this.myElement 引用它。