Javascript 过滤+；分页问题

我正在为我的一个项目做一些过滤和分页。我正在使用Mixitup和simplePagination来实现我的目标，这是基于类别、ASC和DESC排序和分页的基本过滤

但我似乎无法让这个代码正常工作

HTML

随机
升序
降序
全部
Ipapers
录像带

    <button class="sort" data-sort="random">Random</button>
    <button class="sort" data-sort="order:asc">Ascending Order</button>
    <button class="sort" data-sort="order:desc">Descending Order</button>
    <button class="filter" data-filter="all">All</button>
    <button class="filter" data-filter=".video">Ipapers</button>
    <button class="filter" data-filter=".ipaper">Video</button>

    <section id="posts" class="posts-container">
            <article class="mix post post-1 video" data-order="1">
                    <h3>An article</h3>
        <p>Article content</p>
            </article>
            <article class="mix post post-2 ipaper" data-order="2">
                    <h3>An article</h3>
        <p>Article content</p>
            </article>
            <article class="mix post post-3 ipaper" data-order="3">
                    <h3>An article</h3>
        <p>Article content</p>
            </article>
            <article class="mix post post-4 video" data-order="4">
                    <h3>An article</h3>
        <p>Article content</p>
            </article>
            <div id="posts-nav"></div>
    </section>

    <script type="text/javascript">
        $(function(){

        var items = $(".post");

        var numItems = items.length;
        var perPage = 1;

        items.slice(perPage).hide();
            $('#posts').mixItUp({
                animation: {
                    duration: 400,
                    effects: 'stagger(34ms) translateZ(460px) fade',
                    easing: 'cubic-bezier(0.39, 0.575, 0.565, 1)'
                },
                callbacks: {
                    onMixLoad: function(state){
                        //alert('MixItUp ready... do some pagination!');

                        $("#posts-nav").pagination({
                            items: numItems,
                            itemsOnPage: perPage,
                            onPageClick: function(pageNumber) {
                                var showFrom = perPage * (pageNumber - 1);
                                var showTo = showFrom + perPage;

                                items.hide() 
                                     .slice(showFrom, showTo).show();
                            }
                        });

                    }
                }
            });  
        });
    </script>