react useContext 用法

1 创建createContext

import React, { useContext, useEffect, useState } from 'react'

const GlobalContext = React.createContext()

2 GlobalContext 作为提供者

export default function App(){

  const [filmList,setfilmList] = useState([]);

  const [info,setinfo] = useState('');

  useEffect(()=>{

    return()=>{

      axios.get(`/maizuo.json`).then(res=>{

        setfilmList(res.data)

      })

    }

  },[])

  return (

//GlobalContext 作为提供者

    {

      call:'打电话',

      sms:'短信服务',

      info:info,

      changeInfo:(value)=>{

        setinfo(value)

      }

    }}>

     

   

  )

}

3 通过 useContext(GlobalContext) 可以直接只用提供者属性和方法

function FilmItem(props){

  let { name, poster, grade,synopsis } = props;

  const value = useContext(GlobalContext)

  console.log(value,'--------123')

  return

}

function FileDetail(){

  const value = useContext(GlobalContext);

  return

}