Javascript React useEffect钩子-无限循环与使用ID的redux操作

我将

useffect

与reduce操作结合使用。我知道我必须从props中提取action函数，并将其作为第二个参数提供，这通常适用于批量抓取。但如果我也使用道具的ID，它最终会进入无限循环：

export function EmployeeEdit(props) {
  const { fetchOneEmployee } = props;
  const id = props.match.params.id;
  const [submitErrors, setSubmitErrors] = useState([]);

  useEffect(() => fetchOneEmployee(id), [fetchOneEmployee, id]);

  const onSubmit = employee => {
      employee = prepareValuesForSubmission(employee);
      props.updateEmployee(employee._id, employee)
          .then( () => props.history.goBack() )
          .catch( err => setSubmitErrors(extractErrors(err.response)) );
  };

  return (
    <div>
        <h3>Edit Employee</h3>
        <NewEmployee employee={props.employee} employees={props.employees} onSubmit={onSubmit} submitErrors={submitErrors} />
    </div>
  )
}

EmployeeEdit.propTypes = {
  fetchOneEmployee: PropTypes.func.isRequired,
  employees: PropTypes.array.isRequired,
  employee: PropTypes.object.isRequired
};

const mapStateToProps = state => ({
  employees: state.employees.items,
  employee: state.employees.item
})

export default connect(mapStateToProps, { fetchOneEmployee, updateEmployee })(EmployeeEdit);

})

---

有人知道我做错了什么吗？

依赖项数组中的一个值（

[fetchOneEmployee，id]

）正在更改。由于您提供的代码有限，很难说它是哪个值

---

不过乍一看，您可能希望数组中有

fetchOne

而不是

fetchOneEmployee

您的InFite循环可能是由于fetchOneEmployee作为参数传递给useEffect引起的。您是否将fetchOneEmployee作为箭头函数传递给EmployeeEdit？如果您这样做了，那么fetchOneEmployee将始终处于更改状态

这是关于react hooks获取数据的伟大文章的一部分

---

我特别推荐header自定义数据抓取钩子

我们可以看到更多组件吗？请使用更多代码更新如果您从依赖项数组中删除

fetchOneEmployee

，它是否修复了它？这是一个通过复制我更正的代码而造成的错误

export const fetchOneEmployee = (id) => dispatch => {
   axios.get(`http://localhost:8888/api/users/${id}`)
    .then(res => {
                const employee = res.data;
                dispatch({
                    type: FETCH_ONE_EMPLOYEE,
                    payload: employee
                })
        })
});