useContext() is undefined when i use useLocation()

user_13389682 0
Viewed 314

I'm working on a website using React. I'm getting this error when using useContext() and useLocation().

import React, { useContext } from "react";
import Layout from "../components/Layout";
import { LangStateContext } from "../context/LangContext";

import { useLocation } from 'react-router';


const PricingPage = () => {
  const { isIndoSelected } = useContext(LangStateContext);
  console.log(isIndoSelected);

  const location = useLocation();


  return (
    <Layout>
      a page
    </Layout>
  );
};

export default PricingPage;

This is the error im getting when i land on the page

useContext is undefined error

Can anyone explain to me why this wont work and what a good workaround would be?

Thanks you

use-context reactjs runtime-error javascript
1 Answers

useContext needs Providers to work, so make sure that you have instantiated one that has this component as a direct or indirect child.

Also make sure that the context that you have created to instantiate this provider has this isIndoSelected that you're trying to access.

You can read more about React's Context usage here.

user_173314900
Related