how am I breaking rules of hook?

Asked Mar 28 '20 at 15:33

Active Mar 28 '20 at 15:39

Viewed 27 times

export default function PreferVar(){
const [prefer,setPrefer]=useState({})
useEffect(()=>{
fire.database().ref().child('/users/preference').once("value",(snapshot)=>{
    const item=snapshot.val()
    setPrefer(item)
  }
  );},[])
return(prefer)
}

error message Uncaught Invariant Violation: Invalid hook call. Hooks can only be called inside of the body of a function component. where am I and Which rule am I breaking exactly?

edited Mar 28 '20 at 15:39

asked Mar 28 '20 at 15:33

rajithShetty

Hooks may only be called in functional components or another hook (which is what you appear to be trying to do here), which needs to follow the standard naming convention for hooks. If you rename your function `usePreferVar` it will probably stop complaining. Also, `return` is not a function. – Jared Smith Mar 28 '20 at 15:35
what is preferVar ? – Ahmed Khattab Mar 28 '20 at 15:35
I am still getting same error – rajithShetty Mar 28 '20 at 15:38
@rajithShetty you shouldn't be. How are you calling your custom hook? – Jared Smith Mar 28 '20 at 15:39
`import PreferVar from '../profile/preferVar'; export default class personalFoodCard extends React.Component{ prefVar=PreferVar() getPref=()=>{ ` – rajithShetty Mar 28 '20 at 15:40
@rajithShetty that's your problem. You can't call hooks in a class component, they are for pure functional components. Either stick to classes and use the lifecycle methods, or use pure functional components and hooks. – Jared Smith Mar 28 '20 at 15:41
ok I'll change my code and see if it works – rajithShetty Mar 28 '20 at 15:43
yes thankyou very much.How do i close the question – rajithShetty Mar 28 '20 at 17:11

how am I breaking rules of hook?

0 Answers0