javascript - Web 组件 : how to access a slotted element using shadowRoot. querySelector

标签 javascript web-component native-web-component

您好,我是 Web 组件概念的新手。我想知道我们是否可以使用 shadowRoot.querySelector 访问开槽元素

我已经实现了一个输入字段作为动态设置一些值的插槽。并在其中添加一个类“列标题”。我正在尝试像这样访问 connectedCallback() 中的这个元素

var titleInput = this.shadowRoot.querySelector('.column-title')

但它返回 null。

请帮忙。

最佳答案

离开@royyko 的回应。这里更好的答案是不要给出一个类或 id 来获取插槽......使用已经提供的标识符,它的名称。为此,您需要执行以下操作 this.shadowRoot.querySelector('slot[name=interior]')

关于javascript - Web 组件 : how to access a slotted element using shadowRoot. querySelector,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/54848675/

相关文章:

javascript - JSON.parse 有效,但 jQuery.getJSON 返回 http 错误 403

javascript - 使用 JS 创建的模板标记在附加到 Web 组件内的阴影时不会出现

html - Web Components - 扩展原生元素的样式

javascript - 如何更改 Lit-Element 中的 bool 属性以隐藏组件上的内容?

html - 自动完成/恢复在导航时动态创建的输入表单字段

web-component - Web 组件嵌套插槽

javascript - LitElement 不会为原生 Web 组件设置 textContent

Javascript Curry 函数对这段代码有好处吗?

javascript - 如何在灯箱图像上设置外部链接?

javascript - 为什么这些对象属性未定义?