如何在 solid.js 项目中使用 Web 组件？

Question

当我尝试在我的 Solid.js 项目中使用 Web 组件（而不是构建一个）时，它无法识别标签，因为它不是固有元素。如何设置 solid.js 以识别 Web 组件？

Answer 1

这是扩展全局类型以消除 TS 错误的方法：

declare module "solid-js" {
  namespace JSX {
    interface IntrinsicElements {
      "aero-modal": JSX.IntrinsicElements["div"] & { foo: number };
    }
  }
}

虽然我不知道如何让自定义元素本身发挥作用...但我想他们已经做到了。它们毕竟是自定义元素，solid 不做判断。如果 JSX 中的标签是小写的，它应该将其视为 html 元素。

注意：我放在那里的JSX.IntrinsicElements["div"] & { foo: number }是道具。如果该组件没有任何内容，您可以在此处放置一个 {}。

如何在 solid.js 项目中使用 Web 组件？

How to use a web component in a solid.js project?

reactjs

solid-js