NextJS + React上下文:如何加载数据？

import { createContext } from 'react';

const MyContext = createContext();

import { useState, useEffect } from 'react';

const MyContextProvider = ({ children }) => {
  const [data, setData] = useState([]);

  useEffect(() => {
    // 在这里加载数据
    // 可以使用fetch、axios等进行异步请求
    // 将获取的数据存储在state中
    // setData(response.data);
  }, []);

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

import { useContext } from 'react';

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

  return (
    <div>
      {/* 使用上下文数据进行渲染 */}
      {data.map(item => (
        <p key={item.id}>{item.name}</p>
      ))}
    </div>
  );
};