-1

ERROR

Line 6:44: React Hook "useState" is called in function "app" which is neither a React function component or a custom React Hook function react-hooks/rules-of-hooks

Search for the keywords to learn more about each error.

Mab
  • 1
  • 3
  • Please show the code that generates the error. – Shmili Breuer Jun 15 '20 at 17:17
  • are you calling App as a function App() or as a component ? – Daniel Pérez Jun 15 '20 at 17:20
  • const [personsState, setPersonsState ] = useState({ persons: [ {name: 'Mann', age: '20'}, {name: 'Mab', age: '25'}, {name: 'Bar', age: '43'} ] }); – Mab Jun 15 '20 at 17:20
  • @DanielPérez yes – Mab Jun 15 '20 at 17:21
  • @Mab can you please show the full file that generates the error (you can update your question to show it.) – Shmili Breuer Jun 15 '20 at 17:21
  • @ShmiliBreuer can you get something wrong out of it – Mab Jun 15 '20 at 17:22
  • @Mab you should use PascalCase for components, without you sharing the code I can't tell for sure but if you are using function app() you should use function App() – Daniel Pérez Jun 15 '20 at 17:25
  • @ShmiliBreuer friend as i'm new over here,can u help me out.actually the code is long and over here comment has limit for letters which is lesser then my code.so i'm un able to add comment over here – Mab Jun 15 '20 at 17:27
  • @ShmiliBreuer is here any option for file sharing?? – Mab Jun 15 '20 at 17:27
  • @DanielPérez i'll try that!! – Mab Jun 15 '20 at 17:29
  • @DanielPérez That worked my Friend Thankyou so much !!!!!!! – Mab Jun 15 '20 at 17:31
  • Does this answer your question? [React Hook "useState" is called in function "app" which is neither a React function component or a custom React Hook function](https://stackoverflow.com/questions/55846641/react-hook-usestate-is-called-in-function-app-which-is-neither-a-react-funct) – RIYAJ KHAN Jun 15 '20 at 17:37
  • @Mab you can add the code to the original question by editing the question. – Shmili Breuer Jun 15 '20 at 17:37
  • @ShmiliBreuer i have actually tried it but as there was error in the code so it was not allowing wrong code !!!! – Mab Jun 15 '20 at 17:40
  • @ShmiliBreuer but now as it's solved i'll try to it – Mab Jun 15 '20 at 17:40
  • @ShmiliBreuer I tried it but still there are some problems . it is actually not allowing mine code in the ask quetion section – Mab Jun 15 '20 at 17:44

3 Answers3

0

I ran into this one with typescript, changing the component name to start with capital letter fixed this for me.

asolvent
  • 821
  • 13
  • 26
0

You are using the useState hook and not importing React and the useState Hook in your function

import React,{useState} from "react";

//use a capital letter in the begging of your component name
export const YourComponent = () =>{
   //Now you can use the useState hook here in a react functional component
   const [personsState, setPersonsState ] = useState({ persons: [ 
        {name: 'Mann', age:'20'}, 
        {name: 'Mab', age: '25'}, 
        {name: 'Bar', age: '43'} 
      ] })

   return(
     <div>
       //you can use personsState here now
     </div>
   )
}
Andrew Pinon
  • 1
0

create-react-app version 3+

& newer React versions require components

containing React Hooks to be capitalized (PascalCase).

Meaning: The component name & its export (name).

Change the two (names) app to App.

suhas salunke
  • 1