React组件无法渲染至root容器，报‘Target container is not a DOM element’错误

你用ReactDOM.createRoot的写法完全不符合React 18+的API规范，这就是报错的核心原因：

• createRoot只接受DOM容器元素作为唯一参数，不能把组件传进去
• 创建根实例后，需要调用根实例的render方法，传入要渲染的组件

修正后的index.js代码 #

import ReactDOM from 'react-dom/client';
import './index.css';
import StudentForm from './App';

const root = document.getElementById('root');
// 正确步骤：先传入DOM容器创建根对象，再调用render渲染组件
const rootInstance = ReactDOM.createRoot(root);
rootInstance.render(<StudentForm />);

错误点对比 #

你原来的代码把<StudentForm/>作为第一个参数传给createRoot，还额外加了root参数，完全搞反了API的调用逻辑。而旧的ReactDOM.render是直接传组件和DOM容器，两者调用方式差异很大，这就是旧方法能正常运行的原因。

内容的提问来源于stack exchange，提问作者9ust00learn