Context API _context undefined 에러

store/user.js

import React, { createContext } from "react";

export const userContext = createContext(); //useContext()
export default function UserStore(props) {
  let userObj = {
    name: "mike",
    job: "developer"
  };
  return (
    <userContext.Provider value={userObj}>
      {props.children}
    </userContext.Provider>
  );
}

export안해줘서 그랬음..

 

사용방법

1. app.js에서 감싸주기

import "./styles.css";
import UserStore from "./store/user";
import Test from "./Test";

export default function App() {
  return (
    <UserStore>
      <div className="App">
        <h1>Hello CodeSandbox</h1>
        <Test />
        <h2>Start editing to see some magic happen!</h2>
      </div>
    </UserStore>
  );
}

2. 사용할 컴포넌트에서 호출해서 사용

import React, { useContext } from "react";
import { userContext } from "./store/user";

export default function Test() {
  const input = useContext(userContext);
  return <div>{input.name}</div>;
}