为什么我不能将我的一些代码放在另一个函数中然后调用它？

Question

I have this Redux Thunk action creator:

const addAlert = (pos, msg) => ({
  type: 'ADD_ALERT',
  pos,
  msg
})

// Login Email Field
export const emailField = (email) => {
  return dispatch => {

    // Update Input
    dispatch(updateInput('field1', email));

    //Email validator
    if (email === '') {
      dispatch(addAlert('field1', 'This field is empty'));
      return;
    }

    // If all validators pass clear the alert
    dispatch(deleteAlert('field1'))

  };
}

I want to move the Email Validator part out into its own function and then call it in the same spot where that code is now. however, when I do so the code doesn't dispatch like I want it to. Here is the function I made in the same file:

const validateEmail = (email) => {
  return dispatch => {
    // If email field is empty report alert
    if (email === '') {
      dispatch(addAlert('field1', 'This field is empty'));
      return;
    }
  };
}

Then In my emailField function, I just call:

 validateEmail(email);

and it doesn't behave the same as it did before. I simply want to do a basic move of that code to a js function then execute it in another place.

Answer 1

That's because validateEmail returns redux-thunk function, it does not execute it.
Just call it this way:

dispatch(validateEmail(email));

dispatch also passes up the return value of the wrapped function, so if you want to know that an email is valid or not in emailField you might do the following:

const validateEmail = (email) => {
  return dispatch => {
    // If email field is empty report alert
    if (email === '') {
      dispatch(addAlert('field1', 'This field is empty'));
      return false;
    }

    return true;
  };
}

export const emailField = (email) => {
  return dispatch => {

    // Update Input
    dispatch(updateInput('field1', email));

    //Email validator
    const isEmailValid = dispatch(validateEmail(email));
    if (!isEmailValid) {
      return;
    }

    // If all validators pass clear the alert
    dispatch(deleteAlert('field1'))

  };
}