2

我正在测试 Anuglar Elements 以创建一些 Web 组件并且效果很好。无论如何，我在控制台中收到此警告：

[弃用] Element.createShadowRoot 已弃用，将于 2019 年 3 月左右在 M73 中删除。请改用 Element.attachShadow。 有关详细信息，请参阅https://www.chromestatus.com/features/4507242028072960 。

相关文件是platform-b​​rowser.js:1182。有什么我应该注意的吗？我该如何解决？我应该寻找另一种方法来创建我的 Web 组件吗？

4

2 回答 2

0

根据 MDN Web 文档，此功能将被完全删除。无论如何，大多数网络浏览器都不支持它：

非标

此功能是非标准的，不在标准轨道上。不要在面向 Web 的生产站点上使用它：它不适用于每个用户。实现之间也可能存在很大的不兼容性，并且行为可能会在未来发生变化。

已弃用

不再推荐此功能。尽管某些浏览器可能仍然支持它，但它可能已经从相关的 Web 标准中删除，可能正在被删除，或者可能仅出于兼容性目的而保留。避免使用它，并尽可能更新现有代码；请参阅本页底部的兼容性表以指导您的决定。请注意，此功能可能随时停止工作。

如果您使用的是 Angular，我建议您使用Dynamic Component Loader

于 2019-06-05T14:25:36.090 回答
0

正如错误所述，您将不得不使用

Element.attachShadow 代替。

例子： 

class SomeElement extends HTMLElement {
    constructor() {
        super();
        this.attachShadow({mode: 'open'});
    }

    connectedCallback() {
        this.shadowRoot.innerHTML = 'Hello World!';
        console.log(this.shadowRoot);
    }
}

customElements.define('some-element', SomeElement);

该模式定义您是否可以通过 JavaScript 访问影子根。
对于{mode: 'closed'}中的代码connectedCallback将不起作用，因为this.shaodwRoot返回null。

于 2019-06-18T07:48:17.583 回答