reactjs - 上下文 api，获取空数组

Question

我正在使用上下文 api，但是当我从后端获取数据并尝试将其发送到子组件时，它似乎不起作用，控制台记录了一个空数组。

import {MyApiUrl} from './services/httpService'


export const GlobalState = createContext()

export const DataProvider = ({children}) =>{

    const [categories, setCategories] = useState([])


    const getCategories = async () =>{
        const res = await http.get(MyApiUrl+'/api/jobCategory');
        setCategories({categories:res.data})
    }

useEffect( ()=>{

    getCategories()

},[])

    const mystate = {
      
        categoriesAPI: categories

    
    }
  
   


console.log(categories)
    return (
        <GlobalState.Provider value={mystate}>
            {children}
        </GlobalState.Provider>
    )
}

现在在一个子组件中，它是类

static contextType = GlobalState

  async  componentDidMount(){
   
   
    const mystate = this.context
console.log(mystate,'hey')        //  >>>>>>> ITS NOT CONSOLE LOGGING THE VALUE HERE 

}

标签： reactjsreact-contextreact-class-based-component