记录学习React遇到的问题

1.React18 解决 unmountComponentAtNode()被弃用warning问题

Warning: You are calling ReactDOM.unmountComponentAtNode() on a container that was previously passed to ReactDOMClient.createRoot(). This is not supported. Did you mean to call root.unmount()?
Warning: unmountComponentAtNode(): The node you're attempting to unmount was rendered by React and is not a top-level container. Instead, have the parent component update its state and rerender in order to remove this component.


import React from 'react'
import { createRoot } from 'react-dom/client'
export default function Demo() {
const [count, setCount] = React.useState(0)
const [name, setName] = React.useState('tom')
function add() {
setCount(count + 1)
}
function changeName() {
setName('jack')
}
React.useEffect(() => {
const timer = setInterval(() => {
setCount(count => count + 1)
// setCount(count + 1)为什么无法正确出现效果
}, 1000)
return () => {
clearInterval(timer)
}
}, [])
function unMount() {
// ReactDOM.unmountComponentAtNode(document.getElementById('root'))
const root = createRoot(document.getElementById('root'));
root.unmount()
}
return (