在状态更新后调用第二次调度

时间:2018-01-02 07:15:11

标签: redux state

我写了一个电话簿应用程序来学习redux有两个主要状态:电话簿和编辑模式下的电话簿。因此,当用户完成编辑时,我将验证编辑对象上的值并更新原始对象。

我遇到一个问题,我需要在使用新用户输入更新状态后发送批准调度功能。我试图在mapDispatchtoProps中创建另一个函数,并从ownProps.func()调用它,但它似乎无法识别它。如果我将验证放在批准编辑功能中,则不使用更新状态。

所以我最终写了类似的东西:

const isEditApprove = (dispach, ownProps) => {
  let EditApprove = true;
  if (!ownProps.phone || ownProps.phone.length > 12 || ownProps.phone.length < 9) {
    dispach(rejectEdit(ownProps.id, 'phone')); // change it to const
    EditApprove = false;
  }
  if (!ownProps.name || ownProps.name.trim().indexOf(' ') === -1) {
    dispach(rejectEdit(ownProps.id, 'name')); // change it to const
    EditApprove = false;
  }
  return EditApprove;
};

const mapStateToProps = () => ({});
const mapDispatchtoProps = (dispach, ownProps) => ({
addUserHandler() {
    if (isEditApprove(dispach, ownProps)) {
      dispach(toggleAddUserMode(ownProps.addUserMode));
    }
  },

editUserHandler(event) {
    dispach(changeUserInfo(ownProps.id, event.target.name, event.target.value));

  },
approveEditHandler() {
    if (isEditApprove(dispach, ownProps)) {
      dispach(approveEdit(ownProps.id, ownProps.phone, ownProps.name));
      dispach(toggleEditMode(ownProps.id, ownProps.name, ownProps.phone, ownProps.editMode));
    }
  },

它正在工作,但我觉得有一个更好的方法,然后我的isEditApprove功能。我是否需要使用异步中间件(即使我没有调用任何服务器)?

谢谢, 或

编辑:

添加了我的操作:

export function toggleEditMode(id, name, phone, editMode) {
  return {
    type: TOGGLE_EDIT_MODE,
    payload: {
      name,
      phone,
      id,
      editMode: !editMode,
    },
  };
}

export function approveEdit(id, phone, name) {
  return { type: APPROVE_EDIT, payload: { id, phone, name } };
}

export function rejectEdit(id, errorType) {
  let errorMessage;
  switch (errorType) {
    case 'phone':
      errorMessage = 'The phone number must be between';
      break;
    case 'name':
      errorMessage = 'TThe name must contain two words';
      break;
    default:
      errorMessage = 'Unknown error';
  }
  return { type: REJECT_EDIT, payload: { id, errorType, errorMessage } };
}

0 个答案:

没有答案