如何在JSX中扩展HTMLButtonAttribute类型

Question

我正在使用StencilJS创建一个简单的按钮组件，该组件使用JSX和TypeScript。当前的稳定版本没有属性part的类型。基本上我正在尝试这样做：

render() {
   return <button part="live-chat-button">{this.getStartButtonText()} </button>;
}

但是Typescript错误出现：

Type '{ part: string; }' is not assignable to type 
'ButtonHTMLAttributes<HTMLButtonElement>'. Property
'part' does not exist on type 'ButtonHTMLAttributes<HTMLButtonElement>'.

除了升级到固定的https://matplotlib.org/之外，我该如何解决？

在此先感谢您的帮助！

Answer 1

您应该能够使用模块增强功能将属性添加到任何jsx元素：

declare module '@stencil/core' {
  namespace JSXElements {
    interface ButtonHTMLAttributes<T> {
      part?: string
    }
  }
}

这应该适用于按钮。