Есть ли способ закрыть тост с внешним событием? - PullRequest
0 голосов
/ 24 апреля 2019

У меня есть компонент реагирования, который оборачивает некоторый контент, который недоступен на экранах с разрешением менее 1024 пикселей, если пользователь изменяет размеры экрана, будет инициировано событие, открывающее тост, который можно закрыть, только щелкнув по нему, но если пользователь изменит разрешение до разрешения Я снова хочу закрыть этот тост автоматически. Есть ли способ заставить определенный тост закрыться, назначив какой-то идентификатор, чтобы найти его и щелкнув по нему с помощью javascript?

// this calls a generic function that opens a toast.
manageWarning('', 'You are running on a small screen resolution, this feature it\'s only available on screens up to 1024 px, please scale up the window again', true);

// This is the generic function
export function manageWarning(id, message, disableAutoClose) {
    toastr.options.timeOut = disableAutoClose ? 0 : Global.MESSAGE_ERROR_DURATION;
    toastr.options.extendedTimeOut = disableAutoClose ? 0 : toastr.options.extendedTimeOut;
    toastr.warning(message);
}

Ответы [ 2 ]

1 голос
/ 26 апреля 2019

Мне удалось исправить это с некоторыми изменениями в моей кодовой базе.

Метод предупреждения управления теперь возвращает сам тост

export function manageWarning(id, message, disableAutoClose) {
    toastr.options.timeOut = disableAutoClose ? 0 : Global.MESSAGE_ERROR_DURATION;
    toastr.options.extendedTimeOut = disableAutoClose ? 0 : 
    toastr.options.extendedTimeOut;
    return toastr.warning(message);
}

Теперь потребитель может сохранить ссылку на этот тост

this.toast = manageWarning('', 'You are running on a small screen resolution, this feature it\'s only available on screens up to 1024 px, please scale up the window again', true);

Имея это в виду, теперь я могу просто позвонить

this.toast.fadeIn(); // Method to show the toast again.
this.toast.fadeOut(); // Method close the toast.
0 голосов
/ 26 апреля 2019

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

Если вы собираетесь отображать только один тост и хотите его очистить (иливсе отображаемые тосты), затем просто используйте

toastr.clear();

Если у вас есть сценарий, в котором вы можете отобразить более одного тоста и хотите удалить определенный тост, вы можете получить контейнер тостов, используя

$('#toast-container');

Или получите массив всех тостов с помощью

$('#toast-container').children();

Как только вы это сделаете, вы сможете найти свой конкретный тост и использовать .remove ();

$('#toast-container').children()[1].remove();

Надеюсь, этопомогает

...