React升级到18版本

前言

升级前react版本是16.9.0,react-dom版本为16.9.0,react-router-dom为5.1.2版本。

安装

复制代码
// npm
npm install react react-dom

// yarn
yarn add react react-dom

// pnpm
pnpm install react react-dom

启动项目

此时,项目可以正常运行,但是控制台报如下警告,译为:警告:ReactDOM。React 18不再支持 render。使用createRoot代替。在你切换到新的API之前,你的应用会表现得像在运行React 17一样。了解更多信息:https://reactjs.org/link/switch-to-createroot

react17及之前版本的写法(index.js)

react 复制代码
import App from "./App.js"
import ReactDOM from "react-dom"
 
render(<App />, document.getElementById("root"))

react18的写法(index.js)

react 复制代码
import App from "./App.js"
import { createRoot } from "react-dom/client"
 
createRoot(document.getElementById("root")).render(<App />)
相关推荐
m0_74617719几秒前
小白进阶shell学习-----脚本实战案例
前端·chrome·学习
半碗水8 分钟前
缝缝补补
前端·javascript
用户2519162427119 分钟前
ES6之类的其他书写方式
javascript·ecmascript 6
空城机12 分钟前
从零打造前沿Web聊天室:消息系统
前端·vue.js
BigTopOne20 分钟前
【ijkplayer】 如何降低直播延迟?
前端
curdcv_po24 分钟前
js 中 call、apply、bind 方法的原理与应用
前端
咔咔库奇26 分钟前
axios取消请求
开发语言·前端·javascript
不锋28 分钟前
van-uploader组件动态设置capture属性不生效问题
前端
Jinxiansen021137 分钟前
Nuxt + Pinia + Element Plus 后台管理系统搭建教程(含源码)
前端·javascript·vue.js
前端小巷子1 小时前
浏览器的渲染流程:从 HTML 到屏幕显示
前端·javascript·面试