nuxt.js中使用fullPage.js, 页面刷新后无效

Question

nuxt.js项目中, mounted里初始化fullPage, 路由跳到这个页面全屏滚动没有问题, 在这个页面点浏览器的刷新按钮之后, 就只显示第一屏, 不能滚动了, 求大佬解答

jq和jquery.fullpage.min.css都引入了

if (process.browser) {

    require('fullpage.js/dist/jquery.fullpage.min.js')

    $('#fullpage').fullpage({

        recordHistory: false,

        navigation: true,

        navigationPosition: 'right',

        paddingTop: 40,

        onLeave (index, nextIndex, direction) {

            that.nextIndex = nextIndex

        }

    });

}

Answer 1

mounted() {    if ($('html').hasClass('fp-enabled')) {      $.fn.fullpage.destroy('all');    }    $(function () {      $("#ido").fullpage({        //绑定菜单        anchors: ['page1', 'page2', 'page3', 'page4'],        menu: '#menu',        css3: true      });    });  },  beforeDestroy() {    // 页面离开的时候 一定要销毁fullpage实例  不然页面无法滑动    if ($('html').hasClass('fp-enabled')) {      $.fn.fullpage.destroy('all');      $('#menu').remove();    }  }