0

I get an error in the console as

error!! [Error: Invalid hook call. Hooks can only be called inside of the body of a function component. This could happen for one of the following reasons:

  1. You might have mismatching versions of React and the renderer (such as React DOM)
  2. You might be breaking the Rules of Hooks
  3. You might have more than one copy of React in the same app*
   import firebase from '../../database/firebase';
   import { useDispatch } from 'react-redux';
   import * as actions from "../../store/actions";

    export const userProfilePcture =(id)=>{
       const image = firebase.storage().ref(id + '/profilePicture');
       var user = firebase.auth().currentUser;
       image.getDownloadURL().then((url) => {
       user.updateProfile({
          photoURL: url
        }).then(() =>{
          console.log("updete succefully");
          updeteUser();
        }).catch(error =>{
         console.log("error!!",error);
        });
    
      });


      };

       export const updeteUser=()=>{
       const dispatch=useDispatch();
       var user = firebase.auth().currentUser;
       dispatch(actions.updateUser(user));
     }

How can I avoid this?

devserkan
  • 16,870
  • 4
  • 31
  • 47
Goutham D
  • 23
  • 1
  • 3
  • Does this answer your question? [Invalid hook call. Hooks can only be called inside of the body of a function component](https://stackoverflow.com/questions/56663785/invalid-hook-call-hooks-can-only-be-called-inside-of-the-body-of-a-function-com) – devserkan Jul 07 '20 at 11:07
  • In the above post, you can find the link for documentation about the hooks. Your component should be a proper functional component (starting with a capital letter) or it should start with `use`. – devserkan Jul 07 '20 at 11:08
  • Does this answer your question? [React Hooks Error: Hooks can only be called inside the body of a function component](https://stackoverflow.com/questions/53028117/react-hooks-error-hooks-can-only-be-called-inside-the-body-of-a-function-compon) – Umair Khan Jul 07 '20 at 12:09

1 Answers1

1

This is the hook you are using:

const dispatch=useDispatch();

You can only use hooks inside a React functional component. Right now you are trying to use this hook in a normal javascript function.

Grant Singleton
  • 1,611
  • 6
  • 17