Reactjs 如何让TypeScript引擎在JSX中允许自定义HTML属性？

我假设其中的TypeScript引擎已经收到了一个更新，现在它第一次抱怨我在HTML元素上预先存在的自定义道具是无效的。这是一个Babel/React/JSX项目，没有任何类型脚本

<div custom="bar" />

注意：它们（技术上）是无效的，但我使用它们，所以我知道我在做什么（这是故意的）

另见

• （一年多前我自己发的，现在已经不起作用了）

注意：如果属性名称不是有效的JS标识符（如data-*属性），则如果在元素属性类型中找不到该名称，则不会将其视为错误

---

React类型定义文件（默认情况下，当使用

create React app

启动时-

index.d.ts

）包含所有标准HTML元素以及已知属性的列表

为了允许自定义HTML属性，您需要定义它的类型。 通过展开

HTMLAttributes

接口来实现：

declare module 'react' {
  interface HTMLAttributes<T> extends AriaAttributes, DOMAttributes<T> {
    // extends React's HTMLAttributes
    custom?: string;
  }
}

声明模块“react”{
接口HtmLatAttributes扩展了属性，DOMAttributes{
//扩展React的HtmLatAttributes
自定义？：字符串；
}
}

您是否可以使用

数据-

属性，例如

数据自定义

，这些属性应该有效提供错误消息请将详细信息发送给回答欢迎使用堆栈溢出！请不要把你的源代码扔在这里。对你的答案要和蔼可亲，尽量给它一个很好的描述，这样其他人就会喜欢它并投赞成票。见：