问useContext返回未定义

EN

<div className="App">
    <Navbar />
    <Header/>
<InstructorContextProvider>
<InstructorPage />
</InstructorContextProvider>
</div>

const InstructorContextProvider = (props) => {
const [instructorList] = useState([1,2,3,4]); 
return (
   <InstructorContext.Provider value = {[...instructorList]}>
       {props.children}
   </InstructorContext.Provider>

const InstructorPage = () => {
const [...instructorList] = useContext(InstructorContext);
console.log(instructorList);
return <h1> hello world </h1>
}