React useContext调用editTodo报not a function错误如何解决

editTodo is not a function报错的直接原因是：你注入到TaskContexts.Provider的上下文value对象中，没有包含editTodo等业务方法。
查看你定义的contextsValues：

const contextsValues = {
  editID,
  setEditID,
  editText,
  setEditText,
  isEditError,
  setIsEditError,
  mode,
  setMode,
  state
};

这个对象里仅包含了状态值和状态更新函数，你在组件内定义的editTodo、removeTodo、toggleTodoCompletion、editTodoHandler几个业务方法完全没有被放入上下文value中。子组件通过useContext解构这些字段时拿到的是undefined，调用时自然会抛出“不是函数”的运行时错误。
另外你解构上下文时写的text字段也不存在于上下文value中，同样会拿到undefined。

• 补全上下文value的属性，把所有需要跨组件访问的方法都加入contextsValues：

const contextsValues = {
  editID,
  setEditID,
  editText,
  setEditText,
  isEditError,
  setIsEditError,
  mode,
  setMode,
  state,
  // 补全缺失的业务方法
  editTodo,
  removeTodo,
  toggleTodoCompletion,
  editTodoHandler
};

• 移除useContext解构中不存在的text字段；如果业务确实需要该字段，先把对应的值加入上下文value再解构使用。
• 确认调用useContext(TaskContexts)的组件是TaskContexts.Provider的后代组件：Provider写在TaskList组件中，只有TaskList的子组件能读取到该上下文，不要在TaskList组件自身内部调用这个useContext。

注：你当前代码中已经通过props把所有方法传给了RenderedTable组件，如果只是父子组件传参不需要额外用上下文；如果需要给更深层的子组件透传参数，再通过上下文下发即可，所有需要透传的值必须显式写入Provider的value属性才能被访问到。

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