Cybergei
Cybergei

Reputation: 39

ReactJS useCallback not a function of react?

I have a functional Component which is using the hook useCallback. For the last few days everything was just fine. All worked as it should. Today I start up the app and I have this error:

React Hook "useCallback" is called in function "loginPage" which is neither a React function component or a custom React Hook function

This makes no sense because it has been fine. For debugging I simply erased all code on the page except that one coed and even just put a useCallback template in its place, but still the same. It is as if it has been removed from react entirely.

I checked my react version and find 16.8.6 also in react-dom.

Does anyone have any ideas?

import React, {Fragment,useCallback } from 'react';
import { Redirect} from 'react-router-dom';
import {useDropzone} from 'react-dropzone';

const loginPage = (props) => {

    const callbackFunction = useCallback(() => {
        console.log("callback called");
        // Do something with callbackCount ...
        return true;
    }, []);

  }

Upvotes: 2

Views: 8487

Answers (1)

dance2die
dance2die

Reputation: 36905

I see three problems why the error occurred.

which is neither a React function component or a custom React Hook function

  1. loginPage is not a component. useCallback is a hook and it needs to be called inside a function component (not a class component) or in another hook (a function whose name starts with "use"). Check out the rules of hooks.
  2. And also the component name should start with a capital letter, so it should be LoginPage for it to be a valid React component.
  3. You are not returning anything from your component.

Upvotes: 8

Related Questions