web-dev-qa-db-fra.com

Le conteneur cible n'est pas un élément DOM React.js

J'ai jeté un coup d'oeil à tous les autres articles qui ont eu ce problème, mais je ne comprends toujours pas pourquoi je rencontre cette erreur. Je me suis assuré que j'ai utilisé id dans mon 

Je viens juste de commencer à jouer avec React, alors je suis sûr que c'est quelque chose d'assez ridicule.

Merci pour l'aide à l'avance.

Le code est ci-dessous.

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();

Message d'erreur complet:

invariant

../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
javascripthtmlreactjs
12
Godspped

Assurez-vous de bien vérifier le fichier index.html que vous voyez dans votre navigateur. En supposant que vous utilisiez create-react-app pour créer un pack Web, il pourrait vous servir un fichier différent de la mémoire ou du dossier public.

Une erreur a été trouvée lors de discussions dans des commentaires et discussions.

5
xDreamCoding

Vous devez appeler React.createElement() comme ceci:

ReactDOM.render(React.createElement(<App />), document.getElementById('testing'));
2
Rob Johansen

Vérifiez dans votre fichier HTML si l'attribut id porte le même nom que ReactDOM.render (, document.getElementById ('index'));

0
Front-end Developer