Целевой контейнер не является элементом DOM. React.js
Я просмотрел все другие сообщения, у которых была эта проблема, но я все еще смущен тем, почему я столкнулся с этой ошибкой. Я убедился, что использовал id в своем
Просто начал играть с React, поэтому я уверен, что это что-то довольно глупо.
Спасибо за помощь заранее.
Код ниже.
index.html
<html>
<head>
</head>
<body>
<div id="testing"></div>
<script src="index.js"></script>
</body>
</html>
index.js
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import registerServiceWorker from './registerServiceWorker';
ReactDOM.render(<App />, document.getElementById('testing'));
registerServiceWorker();
Полное сообщение об ошибке:
инвариант
../app/node_modules/fbjs/lib/invariant.js:42 renderSubtreeIntoContainer
../app/node_modules/react-dom/cjs/react-dom.development.js:15144 render
../app/node_modules/react-dom/cjs/react-dom.development.js:15254
▲ 3 stack frames were expanded.
./src/index.js
../app/src/index.js:6
3 | import './index.css';
4 | import App from './App';
5 |
> 6 | ReactDOM.render(<App />, document.getElementById('testing'));
7 |
8 |
9 |
View compiled
▼ 6 stack frames were expanded.
__webpack_require__
../app/webpack/bootstrap 4755e61baeec1360d412:678
fn
../app/webpack/bootstrap 4755e61baeec1360d412:88
0
http://localhost:3000/static/js/bundle.js:35264:18
__webpack_require__
../app/webpack/bootstrap 4755e61baeec1360d412:678
./node_modules/ansi-regex/index.js.module.exports
../app/webpack/bootstrap 4755e61baeec1360d412:724
(anonymous function)
http://localhost:3000/static/js/bundle.js:728:10
Ответы
Ответ 1
Обязательно дважды проверьте index.html, который вы видите в своем браузере. Предполагая, что вы используете приложение create-react-app, таким образом, webpack может служить вам другим файлом либо из памяти, либо из общей папки.
Ошибка была найдена из обсуждения в комментариях и чатах.
Ответ 2
Вам нужно вызвать React.createElement()
следующим образом:
ReactDOM.render(React.createElement(<App />), document.getElementById('testing'));
Ответ 3
Проверьте в html файле, имеет ли атрибут id то же имя, что и
ReactDOM.render(, document.getElementById('index'));