我已经使用Vanilla JS创建了一个简单的Web组件，只需单击即可在新窗口上打开URL.不幸的是，我得到了以下错误

my-component.js:24 Uncaught TypeError: window.open is not a function

下面是我的Web组件：

export class MyComponent extends HTMLElement {
  constructor() {
    super();
  }

  connectedCallback() {
    this._render();
    this._attachEventHandlers();
  }

  _render() {
    const container = document.createElement("div");
    container.innerHTML = `
            <div class='app'>
                <button id="open-me">Open</button>
          </div>`;

    const shadowRoot = this.attachShadow({ mode: "open" });
    shadowRoot.appendChild(container);
    }

    _attachEventHandlers() {
        this.shadowRoot.getElementById('open-me').addEventListener('click', () => {
            window.open('www.google.com', "_blank");
        })
    }
}

window.customElements.define("my-component", MyComponent);

用法，只需在你的HTML中导入并像这样添加它

<代码><；我的组件>；<；/我的组件>；

了什么问题？

顺晟科技：

我会把它缩短为：

 <my-component></my-component>

<代码><；我的组件>；<；/我的组件>；

当您只使用一次时，
• 不需要命名的类定义
• 不需要customElements.define("my-component", class extends HTMLElement { constructor() { let button = document.createElement("button"); button.innerText = "open"; button.onclick = (evt) => { alert("You clicked! " + evt.target.nodeName); open('www.google.com', "_blank"); }; super().attachShadow({mode:"open"}) .append(button); } });，Web组件在全局注册表
中创建
• 不需要<my-component></my-component>soup，除非它们确实有用途。
• export仅当需要同一元素
上的多个事件时才需要
• <代码>窗口。对于div，不需要addEventListener
• window.设置并返回“ this ”范围。所以可以被锁住。
• customElements设置并返回alert；所以可以被锁住。
• 了解open对window的强大功能https：//developer.mozilla.org/en-us/docs/web/api/element/append.

您的super问题不能与Web组件相关。在控制台中检查RAW语句。

在StackOverflow中，它说：