React Native调用useContext报undefined is not an object错误如何解决

核心问题定位 #

你遇到的两个报错根源都属于上下文/函数未正确导出/注册导致的取值为undefined，对应修复方案如下： #

1. 先解决undefined is not an object (evaluating '_useContext.register')报错 #

这是最优先要修的问题，原因是你打错了组件名：

• 你在AuthProvider.js里导出的上下文提供者组件拼写错误，写为了AuthPrivider（把Provider的第二个字母d写成了i）
• 你在根组件引入时大概率是按正确拼写AuthProvider引入，导致实际引入值为undefined，你的整个应用没有被上下文提供者包裹，useContext只能拿到空默认值，自然解构不出register方法

修复步骤：

• 打开AuthProvider.js，把组件导出代码修正为正确拼写：

// 修正前错误代码：
// export const AuthPrivider = ({children}) => {
// 修正后正确代码：
export const AuthProvider = ({children}) => {

• 确认你应用的根组件（一般是App.js或者导航入口文件）已经用AuthProvider包裹了所有子组件，示例代码如下：

import { AuthProvider } from './navigation/AuthProvider';
import { NavigationContainer } from '@react-navigation/native';

export default function App() {
  return (
    <AuthProvider>
      <NavigationContainer>
        {/* 你的所有路由、页面组件都放在这里 */}
      </NavigationContainer>
    </AuthProvider>
  );
}

• 可选优化：给上下文设置默认兜底值，避免未正常包裹时出现undefined报错：

// 把AuthContext初始化代码修改为
export const AuthContext = createContext({
  login: async () => console.warn('AuthProvider未正常加载'),
  register: async () => console.warn('AuthProvider未正常加载'),
  logout: async () => console.warn('AuthProvider未正常加载'),
});

2. 再解决TypeError: undefined is not an object (evaluating 'addTodo(title, description).then')报错 #

这个报错的原因是addTodo函数本身的值为undefined，或者它没有返回Promise对象，你却对它调用了then方法，修复逻辑如下：

• 确认addTodo函数已经被正确导出、引入，路径、拼写都没有错误
• 确认addTodo的定义是async函数（async函数默认返回Promise），或者普通函数里手动返回了Promise对象，不能是无返回值的普通函数

内容的提问来源于stack exchange，提问作者Mohamed suja