简体   繁体   English

Barba Js 在第一次链接上重新加载页面

[英]Barba Js reloads page on first time links

I use Barba js v.2, in a Wordpress site.我在 Wordpress 站点中使用 Barba js v.2。

The first time I click on a link the page changes in the address bar, but immediately it redirects on my page.我第一次单击链接时,地址栏中的页面会发生变化,但它会立即重定向到我的页面上。 The second time I click on the same link, the page changes and the transition works perfectly.我第二次点击同一个链接时,页面发生了变化,过渡效果很好。

Why do I need to click two times on the same link to change the page and make the transition working?为什么我需要在同一个链接上单击两次才能更改页面并进行转换?

I use also the plugin W3 Total Cache on Wordpress.我还在 Wordpress 上使用插件 W3 Total Cache。 Any conflict?有什么冲突吗?

Thanks!谢谢!

it is if your load encounter a error and it forces a reload.如果您的加载遇到错误并强制重新加载。 but while reloading it saves the page on "cache".但是在重新加载时,它将页面保存在“缓存”上。 so... the next time you click the link it will force from the cache... instead of reloading所以...下次您单击链接时,它将强制从缓存中...而不是重新加载

this code helps you track where your code is breaking此代码可帮助您跟踪代码中断的位置

barba.init({
transitions: [{
    debug: true,
    name: 'transiontion name',
    before(data) {
        console.warn('01 - Before --> Start <-');
            //create code here
        console.warn('01 - Before --> End <-');

    },
    beforeLeave(data) {
        console.warn('02 - beforeleave --> Start <-');
            //create code here
        console.warn('02 - beforeleave --> End <-');
    },

    leave(data) {
        console.warn('03 - leave --> Start <-');
            //create code here
        console.warn('03 - leave --> End <-');
    },

    afterLeave(data){
        console.warn('04 - afterLeave --> Start <-');
            //create code here
        console.warn('04 - afterLeave --> End <-');
    },

    beforeEnter(data){
        console.warn('05 - beforeEnter --> Start <-');
            //create code here
        console.warn('05 - beforeEnter --> End <-');
    },

    enter(data) {
        console.warn('06 - enter --> Start <-');
            //create code here
        console.warn('06 - enter --> end <-');
    },

    afterEnter(data){
        console.warn('07 - afterEnter --> Start <-');
            //create code here
        console.warn('07 - afterEnter --> End <-');
    },

    after(data){
        console.warn('08 - after --> Start <-');
            //create code here
        console.warn('08 - after --> End <-');
    }
}]

}); });

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM