MixItUp: операция была запрошена, но экземпляр MixItUp был занят - PullRequest
0 голосов
/ 18 сентября 2018

У меня в данный момент есть какая-то сумасшедшая проблема с MixItUp 3.

Я использую тот же скрипт и функции на домашней странице, а также на подстраницах.

Но только на домашней странице будетпредупреждение после первого процесса фильтрации «ПРЕДУПРЕЖДЕНИЕ: операция была запрошена, но экземпляр MixItUp был занят. Операция была отклонена, поскольку очередь заполнена или очередь отключена.».

Тот же сценарий также находится на подстраницахс теми же данными, но там все отлично работает.

Сайт: https://www.busse -miessen.de / relaunch-2018 / # anwaelte

Сценарий: https://www.busse -miessen.de / relaunch-2018 / wp-content / themes / busse-miessen / js / main.js

Здесь вы можете найти самую важную часть сценария:

var containerEl = document.querySelector('.media_list');
var mixer = mixitup(containerEl);

jQuery('#cat-expertise, #cat-rechtsgebiete').on('selectric-change change', function(e){

    if( mixer.isMixing() ) {
        console.log('isMixing: ' + mixer.isMixing());
        //return;
    }

    var $val = jQuery('#cat-expertise').val();
    var $val2 = jQuery('#cat-rechtsgebiete').val();

    console.log('$val: '+ $val +' - - '+'$val2: '+ $val2);

    var $filter = false;

    if( $val != '0' ) {
        //console.log($val);
        $filter = '.'+$val;
    }

    if( $val2 != '0' && $val != '0' ) {
        //console.log($val2);
        $filter = $filter+', '+'.'+$val2;
    } else if( $val2 != '0' ) {
        $filter = '.'+$val2;
    }

    console.log('final filter: '+$filter+' - State: '+mixer.isMixing());

    if( $filter ) {
        mixer.filter($filter);
    } else {

        $filter = '.mix';

        mixer.filter($filter);
    }
});

jQuery('#mix-sorting').on('selectric-change change', function(e){

    if( mixer.isMixing() ) {
        console.log('isMixing: ' + mixer.isMixing());
        //return;
    }

    var $val = jQuery('#mix-sorting').val();

    mixer.sort('name:'+$val);
});

Кажется, что "mixer.filter ($ filter);"(main.js # 120) не может быть завершено, потому что после первого вызова filter () функция isMixing () полностью "истинна", также после завершения MixItUp.

Пример вывода консоли.log () сверху:

main.js:101 $val: cat-bauen-und-immobilien - - $val2: 0
main.js:117 final filter: .cat-bauen-und-immobilien - State: false
main.js:94 isMixing: true
main.js:101 $val: cat-bauen-und-immobilien - - $val2: 0
main.js:117 final filter: .cat-bauen-und-immobilien - State: true
main.js:94 isMixing: true
main.js:101 $val: cat-healthcare - - $val2: 0
main.js:117 final filter: .cat-healthcare - State: true
main.js:94 isMixing: true
main.js:101 $val: cat-healthcare - - $val2: 0
main.js:117 final filter: .cat-healthcare - State: true
main.js:94 isMixing: true
main.js:101 $val: cat-familie - - $val2: 0
main.js:117 final filter: .cat-familie - State: true
plugins.js:48 [MixItUp] WARNING: An operation was requested but the MixItUp instance was busy. The operation was rejected because the queue is full or queuing is disabled.

Обратите внимание, что эта часть в настоящее время только закомментирована для отладки:

if( mixer.isMixing() ) {
    console.log('isMixing: ' + mixer.isMixing());
    //return;
}

Если я использую ее с «return» там,скрипт перестает работать, потому что "mixer.isMixing ()" имеет значение true все время после первого вызова filter ().

1 Ответ

0 голосов
/ 01 октября 2018

Фон

Эта ошибка обычно возникает из-за того, что MixItUp не удалось «очистить» предыдущую операцию. Операция очищается, когда все цели, которые MixItUp ожидает анимации каким-либо образом (обычно затухание или преобразование), отправили подходящее событие transitionend.

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

Решение

В вашем случае, например, при переключении с «Rechtsgebiete» на «Arbeitsrecht» MixItup ожидает, что 30 целевых элементов будут анимированными, но только 29 из них генерируют событие transitionend. Поскольку эта последняя цель никогда не анимируется, операция никогда не завершается.

Причиной отсутствия анимации является то, что у вас есть цель в DOM контейнера с приложенным display: none (#lawyer-579). MixItUp не знает об этом стиле и ожидает, что цель будет включена в анимацию со своими братьями и сестрами.

Если у вас есть контент, который вы хотите удалить из сетки, лучше не рендерить его, а скрывать с помощью CSS.

...