GetUserConfirmation Приглашение React Router с перенаправлением истории - PullRequest
Новая
       22

GetUserConfirmation Приглашение React Router с перенаправлением истории

0 голосов
/ 21 ноября 2018

Я использую createBrowserHistory с getUserConfirmation для обработки подтверждения пользователя при выходе с страницы, на которой изменилось состояние формы: 

import { createBrowserHistory } from 'history';
import store from './store';
import { displayPrompt } from './ui/navigation-prompt/navigationPromptDucks';

export default createBrowserHistory({
  getUserConfirmation(message, callback) {
    store.dispatch(displayPrompt(message, callback));
  },
});

Работает хорошо: когда я начинаю редактировать форму иЯ пытаюсь покинуть текущую страницу, я получил запрос на подтверждение.

Теперь, скажем, у меня есть кнопка удаления для удаления ресурса формы, и когда удаление прошло успешно, я получил перенаправление истории на страницу со списком ресурсов.

Моя проблема: если я начинаю редактировать форму и, наконец, решаю нажать кнопку удаления, чтобы удалить ресурс, а не редактировать его, история вызывает изменение формы и отображает запрос на подтверждение перед тем, какперенаправление истории.

У меня есть два варианта.Во-первых, я могу вернуть исходное состояние формы, чтобы избежать появления запроса.Во-вторых, существует другой способ предотвратить появление в некоторых случаях запроса.

Какое решение является лучшим?Если это второй, подскажите, как это сделать?

Решение 1 (первый выбор)

Сброс формы до перенаправления истории: 

const mapDispatchToProps = (dispatch, { user, history, t }) => ({
  deleteUser: () => new Promise((resolve, reject) => {
    dispatch(newAlertDialog(
      t('confirmDeleteUser', { user: user.name }),
      t('confirmDeleteTitle'),
      () => dispatch(requestDeleteUser(user.id, resolve, reject)),
      t('delete'),
    ))
  }).then(() => {
    // reset form to avoid prompt user confirmation
    dispatch(reset('EditUser'));
    history.push('/users');
  })
});

1 Ответ

0 голосов
/ 22 ноября 2018

Сброс формы до перенаправления истории кажется лучшим решением в моем случае: 

const mapDispatchToProps = (dispatch, { user, history, t }) => ({
  deleteUser: () => new Promise((resolve, reject) => {
    dispatch(newAlertDialog(
      t('confirmDeleteUser', { user: user.name }),
      t('confirmDeleteTitle'),
      () => dispatch(requestDeleteUser(user.id, resolve, reject)),
      t('delete'),
    ))
  }).then(() => {
    // reset form to avoid prompt user confirmation
    dispatch(reset('EditUser'));
    history.push('/users');
  })
});

Поскольку ресурс будет удален, форма сброса с начальными значениями - хороший способ избежать появления всплывающих подсказок.

...