React Native：渲染的钩子比上一次渲染时更多答案

【问题标题】：React Native : Rendered more hooks than during the previous renderReact Native：渲染的钩子比上一次渲染时更多
【发布时间】：2022-01-10 09:32:36
【问题描述】：

我在实施 gethomeid useState 后遇到此错误，无法理解我尝试了不同的方法，但没有任何效果

import React, {useEffect, useState} from 'react';
import {
  StyleSheet,
  View,
  Image,
  Text,
  TouchableOpacity,
  Button,
} from 'react-native';
import {windowWidth, windowHeight} from '../utils/Dimentions';
//components
import EmptyContainer from '../components/EmptyContainer';
import Header from '../components/Header';
import TopTabs from '../components/Tabs';

//redux
import {getHomeData} from '../action/homedata';
import {connect} from 'react-redux';
import propTypes from 'prop-types';

// to render empty container

const Home = ({getHomeData, homeState, userDetails}) => {
  const [gethomeid, setGethomeid] = useState(null);
  if (userDetails) {
    useEffect(() => {
      getHomeData('123456');
    }, []);
  }
  if (homeState.data != null && userDetails && gethomeid != null) {
    console.log(homeState.data);
    return (
      <View style={{flex: 1}}>
        <Header username={userDetails.name.split(' ')[0]} />
        <TopTabs roomdata={homeState.data.roomMapper} />
      </View>
    );
  } else {
    return (
      <View>
        <EmptyContainer />
      </View>
    );
  }
};

const mapStateToProps = state => ({
  homeState: state.data,
  userDetails: state.auth.user,
});

const mapDispatchToProps = {
  getHomeData,
};

Home.propTypes = {
  getHomeData: propTypes.func.isRequired,
  homeState: propTypes.object.isRequired,
  userDetails: propTypes.object,
};

export default connect(mapStateToProps, mapDispatchToProps)(Home);

我正在尝试加载 2 个按钮，这些按钮会将点击时的数据传递给 gethomeid，但我无法解决此错误

错误的快照：-

【问题讨论】：

标签： reactjs react-native react-redux react-hooks

【解决方案1】：

您正在有条件地调用useEffect 挂钩。这打破了钩子的规则。您可以将条件移到钩子回调中。

useEffect(() => {
  if (userDetails) {
    getHomeData('123456');
  }
}, []);

您可能还应该添加 linter 可能抱怨的任何缺少的依赖项，例如 userDetails 和 getHomeData。

useEffect(() => {
  if (userDetails) {
    getHomeData('123456');
  }
}, [getHomeData, userDetails]);

【讨论】：