React JS如何在钩子中的页面之间传递数据( useEffect)

import React, { createContext } from 'react';

const MyContext = createContext();

const ParentComponent = () => {
  const data = 'Hello from parent component';

  return (
    <MyContext.Provider value={data}>
      <ChildComponent />
    </MyContext.Provider>
  );
};

const ChildComponent = () => {
  return (
    <MyContext.Consumer>
      {data => <div>{data}</div>}
    </MyContext.Consumer>
  );
};

import React, { createContext, useContext } from 'react';

const MyContext = createContext();

const ParentComponent = () => {
  const data = 'Hello from parent component';

  return (
    <MyContext.Provider value={data}>
      <ChildComponent />
    </MyContext.Provider>
  );
};

const ChildComponent = () => {
  const data = useContext(MyContext);

  return <div>{data}</div>;
};