Next.js中使用Context API遇TypeScript报错原因咨询

你遇到的报错完全是TypeScript类型定义不精确导致的，具体原因如下：

1. Context类型定义太宽泛
   在AlertContext.tsx里，你把Context的类型指定为null | Object：

   export const AlertDialogContext = createContext<null | Object>(null);
   

   TypeScript中的Object是最顶层的对象类型，它仅包含所有对象通用的内置属性（比如toString、valueOf），完全不包含你自定义的state和openDialogFxn属性。

2. 实际传入的value与类型不匹配
   你在AlertDialogState.tsx里传给Provider的currentState是一个有明确结构的对象：包含布尔值state和无参函数openDialogFxn，但Context的类型并没有描述这个具体结构。

所以当你在AlertDialog.tsx里通过useContext获取data时，TypeScript只能识别出它是Object或null类型，无法感知到你自定义的属性，因此会抛出“属性不存在于Object类型”的错误——尽管运行时数据是正常的，这只是TS的静态类型检查报错。

内容的提问来源于stack exchange，提问作者Kannu Mandora