Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

205
Vistas
suddenly Error emerging after coding for multiple days: 'React' must be in scope when using JSX react/react-in-jsx-scope

I have been coding on a react.js web app for a few days, just to learn and apply things I have learnt, so please be nice even if the problem is obvious. The Error I get is:

'React' must be in scope when using JSX  react/react-in-jsx-scope

This happened after I installed a library and then uninstalled it, although it could've been cause by something else. After googling about this pretty much all of the things I found were talking about importing react correctly into the file, which I had not done at all, but changing

import { useState } from "react";

to

import React, { useState } from "react";

did not change anything. This is the code the Error is reffering to:

    import React, { useState } from "react";

const AddToDoList = () => {
    const [title, setTitle]= useState('');
    const [des, setDes] = useState('');
    const [subject, setSubject] =useState('Deutsch');
    const handleSubmit=(e)=>{
        //e.preventDefault();
        const Task={title, des, subject, stat:false}
        fetch('http://localhost:8000/tasks', {
            method: 'POST',
            headers: {"Content-Type": "application/json"},
            body: JSON.stringify(Task)
        }).then(console.log("among us is added"));
    }
    return ( 
        <div className="CreateTask">
        <form onSubmit={handleSubmit}>
            <label className="TopText"> Add a Task:
            <br/>
            <input
                className="TextInput" 
                type="text"
                placeholder="Title for Task (Required)" 
                required="required" 
                value={title}
                onChange={(e) => setTitle(e.target.value)}
                />
            </label>
            <br/>
            <textarea placeholder="Short description of Task (Optional)" value={des} onChange={e => setDes(e.target.value)}></textarea>
            <br />
            <select
            value={subject}
            onChange={e=> setSubject(e.target.value)}>
                <option value="Deutsch">Deutsch</option>
                <option value="Biologie">Biologie</option>
                <option value="N/A">N/A</option>
            </select>
            <input className="button" type="submit" />
        </form>
        </div>
        
    );
}
 
export default AddToDoList;

If anyone has any idea, help is hugely appreciated, thank you!

about 4 years ago · Juan Pablo Isaza
2 Respuestas
Responde la pregunta

0

One guess is that, importing React at the top was mandatory and throws this error, until V17.0.0 I think.. so there's a chance that your package-lock.json or node-modules have downgraded your react version

about 4 years ago · Juan Pablo Isaza Denunciar

0

Okay so I have managed to solve it. I have to import react on every single js script I have, even though I have version 18, in which (after the documentation) you don't have to import it. I don't understand why this happend and furthermore why it suddenly wanted me to do this, as it was fine all this time before but it works now and that is really all what matters.

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda