小编jnm*_*jnm的帖子

我正在使用 Next.js 和 React，使用 React hooks + 上下文来管理状态。然而，我遇到了这个问题，React.useContext()即使我传递了我的上下文对象（或者我认为是这样），它也会返回未定义的问题。我是否遗漏了一些非常明显的东西？发生了什么？

我在名为 CartContext 的 const 中创建了上下文，然后在提供程序组件中创建了值对象并将其作为 props 传递给 CartContext.Provider（参见下文中的_app.js）。<h1>我通过添加一个元素来确保上下文提供者包装了我的组件。

问题似乎发生在index.js. 我已经从中导入了 CartContext，./_app.js然后将其作为参数传递给了useContext()应该做的事情，但它不断抛出此错误：

“TypeError：无法解构‘react__WEBPACK_IMPORTED_MODULE_0___default.a.useContext(...)’的属性‘firstSample’，因为它未定义”

根据我收集的信息， useContext() 返回未定义。

_app.js（包裹所有页面）

import React from 'react'
import '../styles/global.css';
import theme from '../components/customTheme';
import { ThemeProvider } from '@material-ui/core/styles';

const MyApp = props => {
  const { Component, pageProps, store } = props

  return (
    <ContextProvider>
      <ThemeProvider theme={theme}>
        <Component {...pageProps} />
      </ThemeProvider>
    </ContextProvider>
  )
}

// Context …