Разрешить создателю действия не отправлять действие

Question

У меня есть создатель следующих действий:

export const toggleLoginModal = () => {
  return {
    type: "TOGGLE_LOGIN_MODAL",
  };
};

Я использую его в своем контейнере с помощью connect ():

export default connect(null, {toggleLoginModal})(MyComp);

Это «тупой» создатель действий - он всегда возвращает один и тот же объект. Я хотел бы, чтобы он проверил, вошел ли пользователь уже в систему, проверив хранилище логов, и если пользователь вошел в систему, он вообще не должен отправлять никаких действий.

Я думал о возвращении нуля в создателе действия, но я думаю, что это плохая практика ... Кроме того, возвращение действия, которое означает «Игнорировать это действие», также кажется неправильным ...

Возможно ли, чтобы создатель действия вообще не отправлял действие? Если да, то как это будет включено в метод подключения?

Answer 1

Как я вижу, у вас есть три варианта:

1. Предотвратите вызов toggleLoginModal, включив логику isLoggedIn в свой компонент
2. Работайте с redux-thunk, чтобы получить доступ к магазину и, при желании, не dispatch действие вообще
3. Обрабатывайте такую ​​логику в своем редукторе, хотя я, вероятно, дважды подумал бы об этом.

Примеры:

Пример 1. Предполагается, что вы можете определить, вошел ли пользователь в систему, посмотрев на состояние

class MyComp extends Component {
  render () {
    return (
      <div>
        {!this.props.isLoggedIn && <button onClick={() => toggleLoginModal()}>Toggle</button>}
      </div>
    );
  }
}

Пример 2. Использование промежуточного программного обеспечения redux-thunk при условии, что у вас есть auth редуктор или что-то подобное.

function toggleLoginModal () {
  return (dispatch, getState) => {
    const { auth } = getState();

    if (auth.isLoggedIn) {
      return;
    }

    dispatch({
      type: "TOGGLE_LOGIN_MODAL",
    });
  };
}

Я бы пошел на то, чтобы полностью скрыть кнопку, если это соответствует вашим требованиям (пример 1).