smoothstate.js - кнопка возврата иногда не работает?

Я использую плагин smoothstate.js на моем сайте. Почему-то, время от времени, когда я перемещаюсь по страницам с помощью кнопок "назад" и "вперед", кнопка "назад" перестает работать.

URL меняется, но содержание остается прежним?

Я проверил консоль на наличие ошибок:

TypeError: Cannot read property 'state' of undefined

Кто-нибудь знает, почему это происходит? Как я уже сказал, в большинстве случаев все работает хорошо, но внезапно - нет.

Код, который я использую, выглядит так:

$(function(){
  'use strict';
  var options = {
    prefetch: true,
    debug:true,
    cacheLength: 0,
    repeatDelay: 500,


    onStart: {
      duration: 0, // Duration of our animation
      render: function ($container) {
        // Add your CSS animation reversing class
        $container.addClass('is-exiting');

        // Restart your animation
        smoothState.restartCSSAnimations();
      }
    },

    onProgress: {
    // How long this animation takes
    duration: 0,
    // A function that dictates the animations that take place
    render: function ($container) {
                    $container.addClass('is-loading');

                    $('#progressBar').append('<div id="bar"></div>');   
                    var progress = '100%';

                    $('#bar').animate({
                        width: progress
                    }, 400);
    }
    },

    onReady: {
      duration: 0,
      render: function ($container, $newContent) {
        $container.removeClass('is-loading is-exiting');
        // Inject the new content
        $container.html($newContent);
      },
    },

    onAfter: function() {
            navbarAnimate();
            closeMenu();
            ImageSliders();
            initPhotoSwipeFromDOM('.gallery');
            ImageOverlay(); 
            window.parsePinBtns();
            backToTop();

    }
  },


  smoothState = $('#main').smoothState(options).data('smoothState');
});

1 ответ

Решение

Я также столкнулся с этой проблемой, которая возникает, когда кнопки "назад" и "вперед" нажимаются слишком быстро без полной загрузки страницы. Хакерским решением для меня было перезагрузить страницу, если page.cache[page.href] не определен.

/** Handles the popstate event, like when the user hits 'back' */
onPopState = function(e) {
  if(e.state !== null || typeof e.state !== undefined) {
    var url = window.location.href;
    var $page = $('#' + e.state.id); 
    var page = $page.data('smoothState');
 
 if (typeof(page.cache[page.href]) !== 'undefined') {
  var diffUrl = (page.href !== url && !utility.isHash(url, page.href));
  var diffState = (e.state !== page.cache[page.href].state); 

  if(diffUrl || diffState) {
    if (diffState) {
   page.clear(page.href);
    }
    page.load(url, false);
  }
 }
 else {
  //reload the page if page.cache[page.href] is undefined
  location.reload();
 }
    
  }
},

Другие вопросы по тегам