时间戳

首页 > 解决方案 > React Redux - 错误：无效的钩子调用。Hooks 只能在函数组件的主体内部调用

reactjs - React Redux - 错误：无效的钩子调用。Hooks 只能在函数组件的主体内部调用

问题描述

我想使用useSelector()钩子，但我收到了上面提到的错误。我在哪里可以使用这个钩子来访问我的状态数据？

function RetrieveDataSources() {
  var dataSources = useSelector(state => state.dataSourcesReducer);
  console.log(dataSources);
}

class Data extends Component {
  constructor(props) {
    super(props);
    this.state = {
      errorMessage: false,
      isLoading: true,
      resultData: propsState && propsState.resultData,
    };


    RetrieveDataSources();
  }

 
  render() {
    return( some return code );
         }
}


export default Data;

标签： reactjsreduxreact-reduxreact-hooksstate

解决方案

钩子只能在函数组件或自定义钩子中调用。您是从普通函数调用它，而不是因此出现错误。

此外，您似乎想从一个类组件中调用一个钩子——不幸的是，这并不直接受支持。如果您必须使用类组件，请考虑使用 mapStateToProps & connect apis 从您的 redux 存储中获取它。

如果你仍然喜欢在类组件中使用钩子，这里有一个使用函数组件和 React 渲染道具与父组件共享它的示例。这通常由库完成，尽管人们无法确定调用者是使用函数组件还是类组件。

推荐阅读