我有一个如下所示的 React 组件(省略了某些部分),并且我使用 redux 进行状态管理。该getRecentSheets操作包含 AJAX 请求并将响应分派给 redux,后者会state.sheets.recentSheets使用响应的数据进行更新。
所有这些都按预期工作,但在构建时会抛出有关useEffect 缺少依赖项的警告: 'getRecentSheets'。但是,如果我添加getRecentSheets到 useEffect 的依赖项数组,它就会开始无限期地重新运行,从而冻结应用程序。
useEffect我已阅读有关挂钩的 React 文档https://reactjs.org/docs/hooks-faq.html#is-it-safe-to-omit-functions-from-the-list-of-dependency但它没有没有为此类用例提供一个很好的示例。我想这是 useCallback 或 react-redux useDispatch 的东西,但没有例子我不知道如何实现它。
有人可以告诉我在 useEffect 中使用 redux 操作的最简洁和惯用的方法是什么以及如何避免有关缺少依赖项的警告吗?
import React, { useEffect, useState } from 'react';
import { connect } from 'react-redux';
import SheetList from '../components/sheets/SheetList';
import { getRecentSheets } from '../store/actions/sheetsActions';
const mapStateToProps = (state) => {
return {
recentSheets: state.sheets.recentSheets,
}
}
const mapDispatchToProps = (dispatch) => {
return …Run Code Online (Sandbox Code Playgroud)