Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead.

已于 2024-03-22 18:47:11 修改
阅读量1.5k 收藏
点赞数
文章标签： react.js javascript 前端
于 2023-05-21 10:51:28 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/DongShanYuXiao/article/details/130789662
版权

一、错误如下

原因 ：

React团队目前推出最新的版本为18.0，在18.0版本中，React不再支持 ReactDOM.render，如果使用ReactDOM.render，控制台就会报错，但并不影响程序的正常运行。

二、解决办法

修改index.js文件中的报错写法。使用createRoot。

报错写法：

ReactDOM.render(<App/>,document.getElementById('root'))

正确写法：

createRoot(document.getElementById('root')).render(<App/>)

保存，重新运行，就没有报错了！！

浅墨_东
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
解决koa2 ctx.render is not a function报错问题
10-18
主要介绍了解决koa2 ctx.render is not a function报错问题，小编觉得挺不错的，现在分享给大家，也给大家做个参考。一起跟随小编过来看看吧
03 你对 ReactDOM.render( ... ) 操作了解多少慕课专栏1
08-03
在React开发中，ReactDOM.render()函数扮演着至关重要的角色，它是将React组件渲染到浏览器DOM树的入口。本文将深入探讨ReactDOM对象、ReactDOM.render()函数的参数和返回值，以及React元素和组件的基础知识。 首先...
React安装报错:ReactDOM.render is no longer supported in React 18.....behave as if it‘s running React 17.
m0_62118859的博客
03-31 1471
翻译为：React 18中不再支持渲染。改用createRoot。在你切换到新的API之前，你的应用程序会表现得像是在运行React 17。 在package.json文件中可以看到react、react-dom最新安装的版本为： "react": "18.0.0", "react-dom": "18.0.0", 改为17.0.2版本： 终端输入命令： yarn add react@17.0.2 react-dom@17.0.2 --save npm installreact@17.0.2.
react报ReactDOM.render is no longer supported in React 18.
weixin_49662044的博客
04-20 86
react版本问题，react18与react17版本index.js文件写法有区别。
React控制台报错ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you swit
m0_59778008的博客
10-08 6611
React团队目前推出最新的版本为18.0，在18.0版本中，React不再支持 ReactDOM.render，如果使用ReactDOM.render，控制台就会报错，但并不影响程序的正常运行。修改index.js文件中的报错写法。使用createRoot。保存，就可以看到错误没了。
React18控制台报错Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead
stormkai的专栏
12-13 2292
react-dom.development.js:86 Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if it's running React 17. Learn more: https://reactjs.org/link/switch-to-createroot
React控制台警告Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until
C1rq99的博客
04-12 7662
出现这个警告是因为ReactDOM.render()方法在react18中不支持了，createRoot()作为替换代码改为 import { createRoot } from 'react-dom/client'; const container = document.getElementById('root'); const root = createRoot(container); root.render(<BrowserRouter> <Switch> &l
Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switc
南风花海的博客
08-06 1093
代码】Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switc。
react报错ReactDOM.render is no longer supported in React 18. 解决
分享互联网的有趣知识~
10-06 2381
React 18不再支持渲染。使用createRoot代替。在您切换到新的API之前，您的应用程序将表现得像在运行React 17。React团队目前推出最新的版本为18.0，在18.0版本中，React 18 不再支持 ReactDOM.render。在index.js文件内使用createRoot即可。
react-render-stream:react.render道具流到Element的Component
05-25
React渲染流react.render道具流到Element的Component 稳定性：实验性。 期待意外。安装使用 ，执行： npm i --save react-render-stream用法 var reactRenderStream = require('react-render-stream');检查执照国际...
brless:less.render() browserify 变换
07-02
无less.render() browserify 变换例子对于 main.js： var less = require ( 'less' ) ;less . render ( '.some { .class { color: black; }}' , function ( err , output ) { console . log ( output ) ;} ) ; 首先...
react-dsmjs:React.render（ClientOrServer，document.querySelector（'。you-decide'））;
05-16
react-dsmjs （ClientOrServer，document.querySelector（'。you-decide'））;它是MVC中的V 与Angular和Backbone等其他框架配合良好JSX，结合了您的标记和行为JS 尝试使用原始JS，例如数组，对象和函数虚拟DOM 区分...
ReactDOM.render is no longer supported in React 18. Use createRoot instead.
kalrry
09-21 3196
React团队在3月29日新推出了React v18.0版本，现在npm 默认的就是18版本，而React 18 不再支持 ReactDOM.render，所以控制台才会抛出以上错误。
React18警告:ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until youswitc
weixin_43754395的博客
11-01 731
React18控制台警告：ReactDOM.render is no longer supported in React 18 Use createRoot instead.
报错Warning: ReactDOM.render is no longer supported in React 18.Use createRoot instead.Until you...
super码力的博客
07-01 3612
报错Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if it's running React 17.
Warning: ReactDOM.render is no longer supported in React 18.
m0_52749777的博客
05-25 4268
React错误：Warning: ReactDOM.render is no longer supported in React 18.
React报错：Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until y
u010234868的专栏
09-08 2812
【代码】React报错：Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until y。
react-dom.development.js:73 Warning: ReactDOM.render is no longer supported in React 18. ...
m0_57634092的博客
11-07 197
意为：警告: React 18 不再支持 ReactDOM.render 方法。请改用 createRoot 方法。在切换到新的 API 之前，您的应用程序将表现得像在运行 React 17 一样。在第一次安装react的情况下，npm 默认为18版本，由于React 18 不再支持 ReactDOM.render。
主流框架选择：React、Angular、Vue的详细比较
最新发布
一些平时在开发过程中遇到的常见问题，分享给大家
06-17 697
主流框架选择：React、Angular、Vue的详细比较
main.jsx:5 Warning: ReactDOM.render is no longer supported in React 18. Use createRoot instead. Until you switch to the new API, your app will behave as if it's running React 17. Learn more 代码实例
06-07
当你升级到 React 18 版本时，需要使用 `createRoot` API 进行挂载，下面是一个示例代码： ```jsx import React from "react"; import ReactDOM from "react-dom"; function App() { return <h1>Hello World!</h1>; } const rootElement = document.getElementById("root"); // 使用 createRoot 进行挂载 ReactDOM.createRoot(rootElement).render(<App />); ``` 这里使用 `createRoot` API 替代了之前的 `ReactDOM.render` 方法，并将要渲染的组件 `<App />` 作为参数传递给 `render` 方法。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值