美文网首页
如何向 TypeScript/JSX 中的现有 HTML 元素添

如何向 TypeScript/JSX 中的现有 HTML 元素添

作者: 很好就这样吧 | 来源:发表于2023-04-11 11:25 被阅读0次

场景:
给div元素添加自定义属性,作为埋点点击位标识,遇到ts报错

错误提示:
不能将类型“{ children: string | undefined; className: any; clstag: string; }”分配给类型“DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>”。
类型“DetailedHTMLProps<HTMLAttributes<HTMLDivElement>, HTMLDivElement>”上不存在属性“clstag”。ts(2322)

错误截图:

解决办法:
typings.d.ts 文件中添加以下接口声明即可

//  typings.d.ts
declare namespace React {
  interface HTMLAttributes<T> extends HTMLAttributes<T> {
    clstag?: string
  }
  interface RefAttributes<T> extends RefAttributes<T> {
    clstag?: string
  }
}

相关文章

  • react 简要心得

    1.JSX要加小括号() 如果存在子元素,则就像在HTML中那样直接包裹在父元素中即可(注意换行的JSX要加小括号...

  • react 在模板中渲染 html 字符串

    在 jsx 中 渲染 html 元素在上半部分标签中使用 dangerouslySetInnerHTML={{ _...

  • React JSX与HTML的区别,JSX的语法

    JSX:属性和方法非常少,运算速度快JSX编译成功后是一个React虚拟DOM元素HTML:原生HTML元素使用d...

  • React学习(3)-JSX介绍

    直接写在js代码里的html,就是jsx。不需要引号引起来。以<开头, >结尾。 JSX产生react的元素,元素...

  • Bootstrap组件 - 列表组

    知识点 列表组中的每个元素都可以是任何 HTML 内容。创建步骤: 向ul添加 .list-group类 向li添...

  • TypeScript 笔记 FAQ(不定时更新)

    FAQ div 上用到 scrollTop 属性,但 ts 报了的错误(TypeScript 如何向 HTML D...

  • TypeScript 如何向 HTML DOM 元素扩展类型声明

    问题 因为在 div 上用到 scrollTop 属性,所以 ts 报了下面的错误,说某个类型上不存在 scrol...

  • TypeScript基础入门之JSX(二)

    转发 TypeScript基础入门之JSX(二) 属性类型检查 键入检查属性的第一步是确定元素属性类型。内在元素和...

  • 第二章 在HTML中使用JavaScript

    2.1