微信公众号搜"智元新知"关注
微信扫一扫可直接关注哦!

barba js v2 reinit main.js 脚本

如何解决barba js v2 reinit main.js 脚本

我正在为 barba js v2 苦苦挣扎。 ajaxtransition 后,我的 main.js 脚本停止工作。我想以某种方式重新初始化这个脚本......

我有这样简单的barba过渡->

tickFormatterSpec: new charts.AutoDateTimeTickFormatterSpec(
        hour: new charts.TimeFormatterSpec(
          format: 'H:mm',transitionFormat: 'H:mm',),

我有 import barba from "@barba/core" class Transition { constructor() { // console.log(barba) this.events() } events() { // console.log("events") barba.init({ transitions: [ { name: "default-transition",leave() { // create your stunning leave animation here console.log("leave") },enter() { console.log("enter") // create your amazing enter animation here } } ] }) } } export default Transition 标签的和

</body>

在这个 main-dist.js 脚本中,有几个其他的脚本被导入,例如一个显示当前日期的函数

当我第一次进入该页面时,一切正常,但是当我进入另一个页面并返回应显示当前日期的页面时,日期未显示,因为脚本未初始化。它仅在加载时初始化,而不是在 ajaxload 上。

所以我的障碍是以某种方式在 ajaxload 上重新初始化这个脚本。

解决方法

我想通了。我们可以在过渡脚本中使用 barba hook "after" :)

barba.hooks.after(() => {
const bottomDOM = document.getElementsByTagName("body")[0]
const newScript = document.createElement("script")
const oldScript = document.querySelector(".main-script")
newScript.src = "js/main-dist.js"
newScript.className = "main-script"
oldScript.remove()
bottomDOM.appendChild(newScript)
})

我在 DOM 末尾有一个 <script class="main-script" src="js/main-dist.js"></script>,使用 barba.hook 将其删除,然后再次添加

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。