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

我假设 Visual Studio Code中的TypeScript引擎收到了一个更新,现在第一次抱怨HTML元素上的预先存在的自定义道具无效.这是在没有TypeScript的Babel / React / JSX项目中.

<div custom="bar" />

注意：它们(技术上)无效,但我消耗它们,所以我知道我在做什么(这是故意的).

See it on CodePen!

也可以看看

> How do I add attributes to existing HTML elements in TypeScript/JSX?(一年前由我自己发布,不再工作).
> JSX | Type Checking

解决方法

Note: If an attribute name is not a valid JS identifier (like a data-* attribute),it is not considered to be an error if it is not found in the element attributes type.

< div data-custom =“bar”/>

https://www.typescriptlang.org/docs/handbook/jsx.html#attribute-type-checking
https://developer.mozilla.org/en-US/docs/Web/HTML/Global_attributes/data-*