为了账号安全,请及时绑定邮箱和手机立即绑定

React useEffect hook - 使用 ID 的 redux 操作的无限循环

React useEffect hook - 使用 ID 的 redux 操作的无限循环

弑天下 2021-10-21 15:08:32
我正在useEffect与减少操作结合使用。我知道我必须从 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);以及 redux 动作: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                })        })});};有人知道我做错了什么吗?
查看完整描述

2 回答

  • 2 回答
  • 0 关注
  • 205 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信