小编Aar*_*n56的帖子

我正在尝试开始使用 React 上下文挂钩，但我似乎遇到了一个我不明白的问题。

我定义了一个用户上下文，它只是一个表示“hello user”的字符串，如下所示：

import { useContext, createContext } from "react"

export const UserContext = createContext<string | null>(null)

export interface IAuth {
  children: React.ReactNode;
}

const Auth: React.FC<IAuth> = (props) => {

  return(
    <UserContext.Provider value={"hello user"}>
      {props.children}
    </UserContext.Provider>
  )
}

export default Auth

然后我尝试访问是这样的：

const Dash: NextPage<dashPageProps> = (props) => {

  const contextMsg = useContext(UserContext)

  const submitForm = () => {
    console.log("logout")
  }

  return (
    <Auth>
    <div className="w-screen">
      <div className='text-xl'>
        Dashboard
      </div>
      <h1>{contextMsg}</h1>
      <button className='bg-gray-400 border-2 border-gray-600 w-fit mt-5' …