在没有过滤的页面上进行 mixitup 过滤时出错

Question

在我的主页上，我使用这个进行 mixitup 工作：

var containerEl = document.querySelector('.gallery-container');
    var mixer = mixitup(containerEl, {
        selectors: {
            control: '[data-mixitup-control]'
        },
        load: {
            filter: '.engagement-ceremony'
        }
    });

我从他们的网站上得到了这个。它工作正常，但是当我转到另一个页面时，我在控制台中收到此错误： Uncaught Error: [MixItUp] An invalid selector or element reference was passed to the mixitup factory function 这导致页面上的其他 js 崩溃。

我想我会试试这个，看看会发生什么：

var mixer = mixitup('.gallery-container', {
        selectors: {
            control: '[data-mixitup-control]'
        },
        load: {
            filter: '.engagement-ceremony'
        }
    });

但后来我得到了这个错误：Uncaught Error: [MixItUp] The provided selector yielded no container element。

我很困惑为什么会这样出错。

编辑所以我能让它正常工作而没有错误的唯一方法是使用 mixitup 脚本的这一部分并使用 php 有条件地将它加载到我的主页上。一个困扰我的骇人听闻的修复程序，但这是唯一可行的方法。

Answer 1

// Gallery Filtering
    var containerEl = document.querySelector('.gallery-container');
    var mixer;

    if (containerEl) {
        mixer = mixitup(containerEl, {
             selectors: {
                 control: '[data-mixitup-control]'
             },
             load: {
                 filter: '.engagement-ceremony'
             }
        });
    }

我不得不将脚本包装在 if 语句中。

在没有过滤的页面上进行 mixitup 过滤时出错

Error with mixitup filtering on pages that don't have filtering

javascript

jquery

mixitup