React中提示XXX不能用作JSX组件

9月前作者：长安雨似花分类：Toy博客阅读(47) 违法举报

这篇具有很好参考价值的文章主要介绍了React中提示XXX不能用作JSX组件。希望对大家有所帮助。如果存在错误或未考虑完全的地方，请大家不吝赐教，您也可以点击"举报违法"按钮提交疑问。

React中提示XXX不能用作JSX组件

1.在公司项目中，多个页面出现过报错，在开发后发现对页面没有影响，一直没有进行处理，后来再次处理的时候没有找到问题发生的情况，在CSDN找到帖子，使用如下的方式解决了文件报错

React中提示XXX不能用作JSX组件

此时发现自己封装的组件仍旧提示 "xxx"不能用作JSX组件，后来查询发现原因是ts与@types/react版本不适配，由于版本问题导致的提示报错，大家可以查询自己项目中的@types/react版本和ts版本进行更换，

查询本地ts版本

npm view typescript version

查询本地@types/react版本

在package.json文件中查看

报错原因https://www.npmjs.com/package/@types/react?activeTab=versions文章来源地址https://www.toymoban.com/news/detail-509577.html

到了这里，关于React中提示XXX不能用作JSX组件的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：如若内容造成侵权/违法违规/事实不符，请点击违法举报进行投诉反馈，一经查实，立即删除！

分享到：

领支付宝红包赞助服务器费用

React【React是什么？、创建项目、React组件化、 JSX语法、条件渲染、列表渲染、事件处理】(一)

React是什么？为什么要学习React React开发前准备创建React项目

2024年02月11日
浏览(52)
【React】‘React‘ must be in scope when using JSX react/react-in-jsx-scope

React 报错：意思是在使用 JSX 时，没有引入 React ，比如像这样：在使用 import 引入时，没有引入 React 。所以在被 Eslint 的 \\\"plugin:react/recommended\\\" 检查时，就会报错。于是很多人就选择引入的时候加上 React ，这样这样确实不报错了，但是他们忽略了一个版本事实：在 React@17

2024年02月15日
浏览(42)
React——Ant Design组件库Message全局提示的使用

官网推荐使用Hook调用的方法这种方法只能在本页显示，如果显示后跳转页面就不会显示。因为{contextHolder}是写在本页面的。如果需要跳转页面可以用promise调用传递的参数依次为，提示信息、显示时间、关闭后触发的回调

2024年02月11日
浏览(43)
【react从入门到精通】React JSX详解

✍创作者：全栈弄潮儿 🏡 个人主页：全栈弄潮儿的个人主页 🏙️ 个人社区，欢迎你的加入：全栈弄潮儿的个人社区 📙 专栏地址：react从入门到精通【分享几个国内免费可用的ChatGPT镜像】【10几个类ChatGPT国内AI大模型】【用《文心一言》1分钟写一篇博客简直yyds】【用

2024年02月05日
浏览(50)
【React基础】– JSX语法

◼ 这段element变量的声明右侧赋值的标签语法是什么呢？  它不是一段字符串（因为没有使用引号包裹）；  它看起来是一段HTML元素，但是我们能在js中直接给一个变量赋值html吗？  其实是不可以的，如果我们将 type=“text/babel” 去除掉，那么就会出现语法错误

2024年01月21日
浏览(72)
React笔记（二）JSX

一、JSX JSX是javascript XML的简写，实际上是javascript的扩展，既有javascript的语法结构，又有XML的结构 1、JSX的规则要求 jsx必须要有一个根节点如果不想产生无用的根标签，但是还要遵守JSX的语法的要求，可以使用如下两种方式 JSX必须要有一个根节点，而且编译之后在浏览器中不

2024年02月11日
浏览(42)
React02-JSX 语法

React.createElement 是 jsx 语法的编译结果，这个函数用来创建一个 React 元素，它的返回值是一个 Virtual DOM（虚拟DOM）。 React.createElement(type, props, ...children) 第一个参数为元素类型，可以是标签名或组件名，第二个参数为元素属性，第三个参数为子节点列表。以上2种写法是等价的

2024年02月12日
浏览(37)
React的基础概念JSX

首先我们需要创建虚拟DOM，然后渲染虚拟DOM到页面上展示其次在写react的内容的时候，我们在script里面，需要填写类型为babel，而不是JavaScript。因此我们需要在上方引入babel文件夹另外还需要引入react核心库和react-dom文件，react-dom是用于支持react操作DOM的类型为babel是为了告诉

2024年02月11日
浏览(39)
React的jsx的用法

React是一个流行的JavaScript库，用于构建用户界面。它使用一种名为JSX的语法扩展来描述组件的结构和样式。JSX是React的核心语言之一，它允许开发人员在JavaScript中编写HTML，从而使代码更加简洁和易于阅读。 JSX是一种语法扩展，它允许开发人员在JavaScript中编写类似于HTML的代

2024年02月10日
浏览(47)
react06-jsx渲染机制

构建视图的具体流程：将jsx语法，编译为虚拟dom对象，根据react中的处理生成virtualDom ，这是react自己内部构建的一套对象体系，基于jsx中的属性描述构建成视图中真实DOM的相关描述,具体通过 React.createElement(type , props , children) 将虚拟dom构建成真实dom 补充：第一次渲染是直接

2024年04月28日
浏览(26)