当我使用 useLocation() 时，useContext() 未定义答案

【问题标题】：useContext() is undefined when i use useLocation()当我使用 useLocation() 时，useContext() 未定义
【发布时间】：2021-11-30 01:40:43
【问题描述】：

我正在使用 React 开发一个网站。使用 useContext() 和 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;

这是我登陆页面时遇到的错误

谁能向我解释为什么这不起作用以及有什么好的解决方法？

谢谢你

【问题讨论】：

运气好能找到解决方案吗？我刚刚遇到了这个问题：当我添加 useLocation 时，useContext 变得未定义。但是，如果我评论 useLocation 行，就没有问题了...

标签： javascript reactjs runtime-error use-context

【解决方案1】：

useContext 需要 Providers 才能工作，因此请确保您已将具有此组件的一个实例化为直接或间接子级。

还要确保您为实例化此提供程序而创建的上下文具有您尝试访问的 isIndoSelected。

你可以阅读更多关于 React 的上下文使用here。

【讨论】：

感谢您的回复。我在许多其他页面上将“useContext”与“isIndoSelected”结合使用，没有任何问题。破坏它的“useLocation”，这是我不明白的。
您的供应商是如何组织的？你确定这个页面是任何提供者的后代吗？
是的，我确定，其他页面和此页面在不使用 useLocation() 的情况下也可以正常工作。当我用 useLocation() 声明位置时，useContext 是未定义的。