Question

错误：无效的挂钩调用。挂钩只能在功能组件的主体内部调用。发生这种情况可能是由于以下原因之一：

您可能使用了不匹配的React和渲染器版本（例如React DOM）
您可能正在违反挂钩规则
您可能在同一应用中拥有多个React副本

Answer 1

挂钩只能在功能组件中使用。根据{{3}}，它们可以从

调用

反应功能组件。
自定义挂钩

为了其他问题

在使用基于类的组件进行反应时，是否可以使用react-redux（useDispatch）？

是的，有很多方法可以在基于类的组件中使用react-redux。使用react-redux库提供的Rules of hooks API，它将把动作创建者注入到类组件中。最终由dispatch访问所需的this.props函数。您可以查看connect，了解如何使用它的基本示例。

希望这会有所帮助。

Answer 2

不能将钩子与类组件一起使用。如here中所述，您需要创建一个容器/包装器组件来传递操作。

为此，您必须像这样从'react-redux'中使用connect：

import { connect } from 'react-redux'

const mapDispatchToProps = dispatch => {
  return {
    onTodoClick: id => {
      dispatch(toggleTodo(id))
    }
  }
}

const VisibleTodoList = connect(mapStateToProps (HERE NOT NEEDED; IF YOU WANT TO DISPATCH ONLY), mapDispatchToProps)(TodoList)

export default VisibleTodoList

这会将onTodoClick通过道具传递给您的组件，您可以像调用任何道具一样调用它们：this.props.onTodoClick()

有没有一种方法可以在基于类的组件中使用react-redux（useDispatch）？我在render函数中使用useDispatch

2 个答案: