找不到 Next Js 上下文。

Question

import { createContext, ReactNode, useState } from 'react';
import { MenuItem } from '../interfaces/menu.interfaces';
import { TopLevelCategory } from '../interfaces/page.interface';

export interface IAppContext {
    menu: MenuItem[];
    firstCategory: TopLevelCategory;
    setMenu?: (newMenu: MenuItem[]) => void;
}


export const AppContext = createContext<IAppContext>({menu: [], firstCategory: TopLevelCategory.Courses});


export const AppContextProvider = ({ menu, firstCategory, children }: IAppContext & { children: ReactNode }): JSX.Element => {
    const [menuState, setMenuState] = useState<MenuItem[]>(menu);
    const setMenu = (newMenu: MenuItem[]) => {
        setMenuState(newMenu);
    };

    return <AppContext.Provider value={{ menu: menuState, firstCategory, setMenu }}>
        {children}
    </AppContext.Provider>;
}; 

我有这段代码，但它无法看到AppContext，并且错误显示为Cannot find namespace 'AppContext'. ts(2503)。

当我在上面创建它时，我不明白为什么它找不到AppContext，请帮忙解决问题。 这里

- PrinceLoren

---

这个回答解决了你的问题吗？在使用React-TypeScript创建Context时出现“找不到命名空间'ctx'”错误。 - Ryan M

Answer 1

请使用.tsx代替.ts，这样应该可以解决问题。

如果需要更多信息，请参考- 使用React-TypeScript创建上下文时出现“找不到命名空间'ctx'”错误

- Dhilip H

Answer 2

你的文件扩展名很可能是 .ts 而不是 .tsx。

请将扩展名更改为 filename.tsx。

- Rashed Rahat