如何使用反应钩子修复比上一次渲染更多的钩子

Question

index.tsx

   import useUser from '@services/users';
    import React, { useState, useEffect } from 'react';
    import { useTranslation } from 'react-i18next';

function App() {
      const { t } = useTranslation();
    
      const { getAll } = useUser();
      const [ rowData, setRowData ] = useState([]);
    
     useEffect(() => {
        let ignore = false;
        (async function setAllData() {
          let response = await getAll({ length: 9999 });
        })()
        if (!ignore) {
            setRowData(response['data']['data']);
          }
        })()
        return () => {
          ignore = true;
        }
      }, [])
    
     return (
        <>
          <button>{t('create')}</button>
          {
            rowData.map((item, index) => (
              <div key={index}>
                {item.firstName}<br/>
              </div>
            ))
          }
        </>
      )
    }
    export default App;

user.tsx

export default function useUser() {
 const creds = useCredentials();

  Axios.defaults.baseURL = serverConfig[creds.server].api;
  
  return {

    getAll: (params?: object) => Axios.get(API_URL + (params ? getQueryParams(params) : ''))
    }

    }

当我添加作为 useTranslation 的 react-i18next 时遇到了问题。错误消息是 Rendered more hooks than during the previous render.添加翻译时。我该如何解决？