我正在尝试通过上下文提供程序呈现数据，但收到此消息阅读JSX元素类型上下文没有任何构造函数或调用签名。
我在App.tsx中的代码是

import { Context } from './interfaces/cardContext';

const App = () => {
  return (
    <div className="App">
      <BrowserRouter>
        <Navbar />
        <Context>
          <RestaurantDetails />
        </Context>
        <Footer />
      </BrowserRouter>
    </div>
  );
};
export default App

和我的上下文页面中

export interface ContextData {
  restaurants: restaurantType[];
}
export interface Props {
  children: React.ReactNode;
}
export const Context = createContext({} as ContextData);

export const Provider = ({ children }: Props) => {
  const [restaurants, setRestaurants] = useState<restaurantType[]>([]);

  useEffect(() => {
    fetch('http://localhost:5001/restaurants')
      .then((res) => res.json())
      .then((data) => setRestaurants(data));
  }, []);
  return (
    <Context.Provider value={{ restaurants }}>{children}</Context.Provider>
  );
};