IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

React Discussion :

Faire fonctionner React (débutant)


Sujet :

React

  1. #1
    Futur Membre du Club
    Femme Profil pro
    Enseignant
    Inscrit en
    avril 2021
    Messages
    24
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Âge : 29
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Enseignant

    Informations forums :
    Inscription : avril 2021
    Messages : 24
    Points : 6
    Points
    6
    Par défaut Faire fonctionner React (débutant)
    Bonjour,
    je début en React. Je suis allée sur leur site et j'ai téléchargé l'exemple présenté ici : https://fr.reactjs.org/docs/add-reac...-in-one-minute .
    L'exemple téléchargé fonctionne mais j'ai essayer de le modifier pour avoir un composant sous forme de fonction au lieu d'une classe (comme cela semble être la nouvelle norme) et là plus rien ne marche...
    La console de mon navigateur m'indiquait
    Uncaught SyntaxError: Cannot use import statement outside a module
    donc j'ai vu sur internet qu'il fallait ajouter ' type = "module" ' dans le HTML ce que j'ai fait et là j'ai de nouvelles erreurs que je ne comprends pas. Bref je suis larguée. Qu'est-ce qui cloche ? Comment puis-je faire fonctionner React ?

    Les erreurs en questions :
    Access to script at '[lien vers mon script js]' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, chrome-untrusted, https.
    index.html:22 GET [lien vers mon script js] net::ERR_FAILED
    Le code :

    Code js : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    import React, { useState } from 'react';
    import { ReactDOM } from 'react-dom';
     
     
    const App = () => {
     const [liked, setLikeValue] = React.useState(false);
     
     
     
       if (liked) 
          return (<p> You liked this. </p>);
     
        return (<button onClick={() => setLikeValue(true)}>
        Cliquez ici
      </button>);
     
    }
    //export default App;
    const domContainer = document.getElementById('like_button_container');
    ReactDOM.render(<App />, domContainer);

    Code HTML : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    <!DOCTYPE html>
    <html>
      <head>
        <meta charset="UTF-8" />
        <title>Add React in One Minute</title>
      </head>
      <body>
     
        <h2>Add React in One Minute</h2>
        <p>This page demonstrates using React with no build tooling.</p>
        <p>React is loaded as a script tag.</p>
     
        <!-- We will put our React component inside this div. -->
        <div id="like_button_container"></div>
     
        <!-- Load React. -->
        <!-- Note: when deploying, replace "development.js" with "production.min.js". -->
        <script src="https://unpkg.com/react@16/umd/react.development.js" crossorigin></script>
        <script src="https://unpkg.com/react-dom@16/umd/react-dom.development.js" crossorigin></script>
     
        <!-- Load our React component. -->
        <script type = "module" src="like-button.js" ></script>
     
      </body>
    </html>

  2. #2
    Futur Membre du Club
    Femme Profil pro
    Enseignant
    Inscrit en
    avril 2021
    Messages
    24
    Détails du profil
    Informations personnelles :
    Sexe : Femme
    Âge : 29
    Localisation : France, Paris (Île de France)

    Informations professionnelles :
    Activité : Enseignant

    Informations forums :
    Inscription : avril 2021
    Messages : 24
    Points : 6
    Points
    6
    Par défaut
    Bonjour,
    j'ai trouvé finalement. Il fallait exécuter le fichier depuis un serveur.

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. Faire fonctionner le make:auth de Symfony avec React
    Par Jujudorange84 dans le forum Bibliothèques et frameworks
    Réponses: 6
    Dernier message: 18/09/2019, 16h22
  2. [React] Impossible de faire fonctionner React-Bootstrap
    Par polaroid62 dans le forum React
    Réponses: 0
    Dernier message: 15/02/2015, 18h01
  3. Réponses: 5
    Dernier message: 21/02/2007, 16h53
  4. Très débutant : je n'arrive pas à faire fonctionner le JDK
    Par miltonis dans le forum Général Java
    Réponses: 20
    Dernier message: 19/10/2005, 21h20

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo